E企盈小程序营销工具技术服务商 热线:4006-838-530

小程序swiper,小程序swiper组件修改默认指示点

E企盈小程序直播系统

htmlviewswiperautoplay=”auto”autoplay=”{{autoplay}}”interval=”{{interval}}”duration=”{{duration}}”current=”{{swiperCurrent}}”bindchange=”swiperChange”blockwx:for=”{{slider}}”wx:key=”unique”swiper-itemimagesrc=”{{item.picUrl}}”/image/swiper-item/block/swiperviewblockwx:for=”{{slider}}”wx:key=”unique”viewdata-i='{{index}}’bindtap=’fn’/view/block/view/viewjsconstapp=getApp()Page({data:{slider:[{picUrl:’../../images/icon-swiper1.jpg’},{picUrl:’../../images/icon-swiper2.jpg’},{picUrl:’../../images/icon-swiper3.jpeg’},{picUrl:’../../images/icon-swiper4.jpg’},],windowHeight:””,windowWidth:””,swiperCurrent:0,autoplay:true,interval:5000,duration:500,windowWidth:wx.getSystemInfoSync().windowWidth},fn(e){this.setData({swiperCurrent:e.currentTarget.dataset.i})console.log(e)},swiperChange:function(e){//console.log(e)this.setData({swiperCurrent:e.detail.current})},})css.swiper-container{position:relative;}.swiper-container.swiper{height:300rpx;}.swiper-container.swiper.img{width:100%;height:100%;}.swiper-container.dots{position:absolute;left:0;right:0;bottom:20rpx;display:flex;justify-content:center;}.swiper-container.dots.dot{margin:08rpx;width:14rpx;height:14rpx;background:#fff;border-radius:8rpx;transition:all.6s;}.swiper-container.dots.dot.active{width:24rpx;background:#41B883;}有帮助到大家的关注我会一直更新小程序常用技术及新玩法。喜欢上方小程序,需要源码的,添加博主微信私信小编.

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 小程序swiper,小程序swiper组件修改默认指示点
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏