🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
### **关于轮播功能说明** ### 用法: #### 实例化对象: * * * * * var my = new myFrame(); #### 直接调用该对象下的carousel()函数: * * * * * my.carousel({ 参数1:参数值1, 参数2:参数值2, ... }); #### 根据需要传入对应的参数: * * * * * my.carousel({ //放置轮播的位置 "place":'#carousel_box', //轮播区内容,接受如何html+css "content":['<img src="" />','<img src="" />','<img src="" />'], //方向,默认水平(level),垂直(vertical) "direction":'level', //是否循环,默认true "cycle":true, //是否显示左右箭头方向,默认true "showArrow":true, //是否显示下标小圆点,默认true "showSubscript":true, //下标的类型:默认小圆点(dot)、矩形(rect) "subscriptClass":'dot', //下标位置:left、center、right,默认居中 "subscriptPosition":'center', //下标颜色 "subscriptColor":'#123456', //下标选中颜色 "subscriptSelectedColor":'yellow', //轮播速度,单位:px "speed":'50', //间隔,停留时间,单位:毫秒 "interval":'2000' }); #### 参数说明: * * * * * | 参数名称 | 参数值 | 默认值 | 其他 | | --- | --- | --- | --- | | place | 放置轮播的位置 | 默认值为body | | | content | 轮播区内容,接受html+css | | | | direction | level、vertical | 默认值为level | 滚动方向,默认水平 | | cycle | true、false | 默认值为true | 是否允许循环 | | showArrow | true、false | 默认值为true | 是否显示左右箭头 | | showSubscript | true、false | 默认值为true | 是否显示下标 | | showSubscriptClass | dot、rect | 默认值为dot | 下标类型,showSubscript为true时才生效 | | subscriptPosition | left、center、right | 默认值为center | 下标位置,showSubscript为true时才生效 | | subscriptColor | 表示颜色的英文或十六进制颜色值 | 默认值为#123456 | 下标颜色,showSubscript为true时才生效 | | subscriptSelectedColor | 表示颜色的英文或十六进制颜色值 | | 下标选中的颜色,showSubscript为true时才生效 | | speed | 整数值,单位px | 默认值为50px | 轮播速度 | | interval | 整数值,单位为毫秒 | 默认值为2000 | 间隔,停留时间 | #### 注意事项: 1. 要想设置下标的属性样式,showSubscript属性值必须为true,否则设置无效; 2. 轮播方式较单一,目前只有滑动式轮播,后期会根据需要增加; #### 完整示例: * * * * * function txt3(){ var my = new myFrame(); my.carousel({ //放置轮播的位置 "place":'#carousel_box', //轮播内容区域,接收html+css "content":['<img src="" />','<img src="" />','<img src="" />'], //轮播的方向,默认水平滑动:level,垂直滑动:vertical "direction":'level', //是否循环,默认true "cycle":true, //是否显示左右箭头方向,默认true "showArrow":true, //是否显示下标小圆点,默认true "showSubscript":true, //下标的类型:默认小圆点:dot、矩形:rect "subscriptClass":'dot', //下标位置:left、center、right,默认剧中 "subscriptPosition":'center', //下标颜色,默认#123456 "subscriptColor":'#123456', //下标选中颜色,默认红色 "subscriptSelectedColor":'yellow', //轮播速度,单位px,默认5 "speed":'50', //间隔时间,停留时间,单位毫秒,默认2000 "interval":'2000' }) }