wxml
<view class="communityMember">
<swiper interval="3000" duration="1000" previous-margin="10px" next-margin="30px" circular="true" bindchange="swiperBindchange" style="height:418rpx!important;">
<block wx:for="{{imgUrls}}" >
<swiper-item catchtap="handleToDapp" data-index="{{index}}">
<view class="slide-image {{currentSwiperIndex == index ? 'zoom-in' : 'zoom-out'}} DAPPimg" style="background:#fff;" >
<image src="{{item}}" style="width:100%;height:322rpx"></image>
</view>
</swiper-item>
</block>
</swiper>
</view>
wxss
.communityMember{
width:100%;
height:550rpx;
background:#F6F7FB;
}
.communityMember swiper{
margin-top: 30rpx;
}
.slide-image {
width: 100%;
height: 100%;
}
.zoom-out {
transform: scale(0.9);
transition: all 0.7s ease-out 0s;
}
.zoom-in {
transform: scale(1);
transition: all 0.7s ease-in 0s;
}
.DAPPimg{
border-radius: 18rpx;
height:100%!important;
width:100%;
border:1px solid #ddd;
}
swiperBindchange(e) {
this.setData({
currentSwiperIndex: e.detail.current
})
},