Trust
Trust
  • 发布:2017-03-03 18:59
  • 更新:2020-11-18 15:21
  • 阅读:21593

【文档】mui.slider轮播组件常用API

分类:MUI

组件介绍

轮播组件是mui提供的一个核心组件,在该核心组件基础上,衍生出了图片轮播、可拖动式图文表格、可拖动式选项卡、左右滑动9宫格等组件。

示例

获取slide组件对象

var slider = mui('#slider').slider();  

常用API

gotoItem(index)
切换到指定轮播

slider.gotoItem(1); //切换至第二个轮播  

prevItem()
上一个轮播

slider.prevItem();  

nextItem()
下一个轮播

slider.nextItem();  

getSlideNumber()
当前所处位置

slider.getSlideNumber();  

stopped
禁用/开启滑动切换

slider.stopped = false; //开启滑动切换  
slider.stopped = true; //关闭滑动切换  

更多

附上一个简单的示例,解压后将html文件放在mui工程的根目录下即可预览效果。
更多关于slide组件的介绍,参考mui官方文档

PS:关于slide组件,使用过程中如有更多的疑问,请在下方留言。

3 关注 分享
超人爷爷 5470824@qq.com 1509251124@qq.com

要回复文章请先登录注册

飞奔的兔子

飞奔的兔子

回复 2776332953@qq.com :
我也没看到...
2020-11-18 15:21
1073106661@qq.com

1073106661@qq.com

背景:每个slider下都是不同的ajax请求,滑动到每个slider下就会调用一次请求,如果连续滑动,就会一直调用;
需求:如何控制只调用最后一次的请求呢
2019-07-17 16:49
2776332953@qq.com

2776332953@qq.com

是认真的么?文档上哪有这些方法?
2018-12-26 10:38
lee60

lee60

回复 沐清风 :
请问下你这个解决了吗?我也有这个问题
2018-10-17 10:31
lee60

lee60

回复 雨打梨花深闭门 :
请问下你这个解决了吗?我也有这个问题
2018-10-17 10:31
雨打梨花深闭门

雨打梨花深闭门

var slider = mui("#slider");
slider.slider({
interval: 1000
});
报错
Cannot read property '0' of undefined at js/mui.min.js:1262
手动滑一下之后会自动滑
2018-10-10 17:16
23983208@qq.com

23983208@qq.com

怎么设置slider的滚动速度
2018-09-04 17:35
沐清风

沐清风

回复 Trust :
动态生成,手动初始化了。
mui('#slider'+i).slider({
interval:2000,
stopped:true,
});
初始化之后需要手动滑动,之后才会变成自动。不手动滑动,就会报错
Cannot read property '0' of undefined
2018-07-13 17:50
9882655@qq.com

9882655@qq.com

回复 1254201467@qq.com :
要先获取slider组件对象
2018-04-08 09:53
9882655@qq.com

9882655@qq.com

回复 9882655@qq.com :
写错了
document.getElementsByTagName('li')[e.detail.slideNumber].classList.add('active');
2018-04-08 09:51