Class: Slide

new Slide()

页面切换,图片滑动等全部统一使用mo.Slide
版本:
  • 1.0
作者:
  • Brucewan
继承:
依赖:
  • module:lib/zepto.js
  • module:src/base.js
  • module:src/tab.js
源码:
Example
     var tab1 = new mo.Slide({
target: $('#slide01 li')
});
  • 参数

  • 属性

  • 方法

  • 事件

  • 名称 类型 参数 默认值 描述
    config.touchMove boolean <optional>
    true 是否允许手指滑动
    config.target object | string 目标选项卡片,即供切换的 Elements list (Elements.length >= 2)
    config.controller object | string <optional>
    'ul>li*' 触发器
    config.effect string <optional>
    'slide' 指定效果,可选值:'slide', 'push', 'flip'
    config.direction string <optional>
    'x' 指定方向,仅效果为'slide'时有效
    config.autoPlay boolean <optional>
    false 是否自动播放
    config.playTo number <optional>
    0 默认播放第几个(索引值计数,即0开始的计数方式)
    config.type string <optional>
    'mouseover' 事件触发类型
    config.currentClass string <optional>
    'current' 当前样式名称, 多tab嵌套时有指定需求
    config.link boolean <optional>
    false tab controller中的链接是否可被点击
    config.stay number <optional>
    2000 自动播放时停留时间
    config.disable number <optional>
    禁止某屏滚动
    config.loop boolean <optional>
    false 是否启用循环滚动
    config.delay number <optional>
    150 mouseover触发延迟时间
    config.prevBtn object | string <optional>
    播放前一张,调用prev()
    config.nextBtn object | string <optional>
    插放后一张,调用next()
    config.easing string <optional>
    'swing' 动画方式:默认可选(可加载Zepto.easying.js扩充):'swing', 'linear'
    config.event object{string:function} <optional>
    初始化绑定的事件
    config.title object{'dataSrc':Element, 'dataProp':String, 'dataWrap':Element, 'delay': Number} <optional>
    初始化绑定的事件
    config.lazy boolean <optional>
    false 是否启用按需加载,需要按需加载的元素设置data-src属性
  • container :object

    目标选项卡片容器
    继承自:
    • mo.Tab#container
    源码:

    controller :object

    目标选项卡片控制器
    继承自:
    • mo.Tab#controller
    源码:

    curPage :number|undefined

    当前播放第几个的索引值
    继承自:
    • mo.Tab#curPage
    源码:

    isPlaying :boolean

    播放状态
    继承自:
    • mo.Tab#isPlaying
    源码:

    prevPage :number|undefined

    上一个选项卡的索引值
    继承自:
    • mo.Tab#prevPage
    源码:

    target :object

    目标选项卡片
    继承自:
    • mo.Tab#target
    源码:
  • constructor()

    构造函数
    继承自:
    • mo.Tab#constructor
    源码:

    disable()

    禁用某屏
    继承自:
    • mo.Tab#disable
    源码:

    enable()

    启用某屏
    继承自:
    • mo.Tab#enable
    源码:

    next()

    播放后一个
    继承自:
    • mo.Tab#next
    源码:

    off()

    绑定事件
    继承自:
    • mo.Tab#off
    源码:

    on()

    绑定事件
    继承自:
    • mo.Tab#on
    源码:

    play()

    开始自动播放
    继承自:
    • mo.Tab#play
    源码:

    playTo(page)

    播放到第几个选项卡
    继承自:
    • mo.Tab#playTo
    源码:

    prev()

    播放前一个
    继承自:
    • mo.Tab#prev
    源码:

    stop()

    停止自动播放
    继承自:
    • mo.Tab#stop
    源码:

    switchTo()

    无动画效果切换
    继承自:
    • mo.Tab#switchTo
    源码:

    trigger()

    触发事件
    继承自:
    • mo.Tab#trigger
    源码:
  • beforechange

    名称 类型 描述
    event object 开始切换
    继承自:
    • mo.Tab#event:beforechange
    源码:

    beforeinit

    名称 类型 描述
    event object 开始初始化前
    继承自:
    • mo.Tab#event:beforeinit
    源码:

    change

    名称 类型 描述
    event object 切换完成
    继承自:
    • mo.Tab#event:change
    源码:

    init

    名称 类型 描述
    event object 初始化完成
    继承自:
    • mo.Tab#event:init
    源码:

    touchend

    名称 类型 描述
    event object 开始切换
    继承自:
    • mo.Tab#event:touchend
    源码:

    touchmove

    名称 类型 描述
    event object 开始切换
    继承自:
    • mo.Tab#event:touchmove
    源码:

    touchstart

    名称 类型 描述
    event object 开始切换
    继承自:
    • mo.Tab#event:touchstart
    源码:
  • 默认滚动效果slide运行Demo二维码

    Loading...

    推动滚动效果push运行Demo二维码

    Loading...

    3d翻转效果flip运行Demo二维码

    Loading...

    循环滚动运行Demo二维码

    Loading...

    锁屏运行Demo二维码

    Loading...

    嵌套的slide运行Demo二维码

    Loading...

    按需加载运行Demo二维码

    Loading...