小程序3d轮播简单实现

3d轮播的简单实现，具体参数可以看微信swiper官方文档
这是wxml页面
view class=“sdswiper”>









css页面
.sdswiper{
width: 100%;
margin-top: 40rpx;

}
.imageContainer{
width: 100%;
height: 345rpx;
margin: 0 auto
}
.item{
height: 345rpx;
}
.itemImg{

width: 94%;
height: 345rpx;
margin: 0 auto;
position: absolute;
border-radius: 15rpx;
z-index: 5;
opacity: 0.7;
box-shadow: 0 3rpx 11rpx 0 #999999;
margin-left: 20rpx;
margin-right: 20rpx;
}
js页面
data: {
bannaer: [’/pages/images/3d_1.jpg’, ‘/pages/images/3d_2.jpg’, ‘/pages/images/3d_3.jpg’]
},
handleChange: function (e) {
console.log(e)
this.setData({
currentIndex: e.detail.current
})
},
效果图如下