<swiper class='swiper-box' indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" >
<block wx:for="{{ bannerUrls }}">
<swiper-item>
<view>
<image class="slide-image" src="{{ item.url }}" bindload='imgHeight' mode='widthFix'></image>
</view>
</swiper-item>
</block>
</swiper>
// 轮播
bannerUrls: [
{
url: 'https://www.71big.com/heqing/zhaojingwang/common/images/banner1.jpg',
linkUrl: ''
},
{
url: 'https://www.71big.com/heqing/zhaojingwang/common/images/banner1.jpg',
linkUrl: ''
},
{
url: 'https://www.71big.com/heqing/zhaojingwang/common/images/banner1.jpg',
linkUrl: ''
}
],
indicatorDots: true,
autoplay: true,
interval: 3000,
duration: 1000,
.slide-image{
width: 100%;height: 100%;
}
.swiper-box .wx-swiper-dots.wx-swiper-dots-horizontal{
margin-bottom: 2rpx;
}
.swiper-box .wx-swiper-dot{
width:20rpx;
display: inline-flex;
height: 5rpx;
margin-left: 10rpx;
justify-content:space-between;
}
.swiper-box .wx-swiper-dot::before{
content: '';
flex-grow: 1;
background: rgba(255,255,255,0.8);
border-radius: 0rpx
}
.swiper-box .wx-swiper-dot-active::before{
background: #ff3333;
}
.swiper-box .wx-swiper-dot-active{
width:40rpx;
}
.test{
width: 100%;height: 187px;
}