⼩程序swiper实现轮播图
⼩程序的滑动组件swiper：
autoplay：⾃动滚动
interval：切换时间间隔
duration：滑动动画时长
indicator-dots：是否显⽰⾯板指⽰点
indicator-active-color：当前选中的指⽰点颜⾊
vertical：滑动⽅向是否为纵向
circular：是否采⽤衔接滑动（⽆缝滚动）
display-multiple-items：同时显⽰的滑块数量
<swiper class="swiper" autoplay="true" interval="3000" duration="1000" indicator-dots="true" indicator-active-color="#007aff" vertical="true" circular="true" <block wx:for="{{imgs}}">
<swiper-item>
<image src="{{item}}" class="item_img"></image>
</swiper-item>
</block>
</swiper>
index.js 中
Page({
/**
* 页⾯的初始数据
*/
data: {
js实现轮播图最简代码imgs:['../../images/1.png','../../images/2.png','../../images/3.png']
},
。。。
})
wxss中
.swiper {
height: 340rpx;
}
.item_img {
width: 100%;
height: 100%;
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。