微信小程序轮播图中间变大_微信小程序swiper实现滑动放大缩小效果

效果图如下所示：

具体代码如下所示：

.swiper-block{

height: 480rpx;

width: 100%;

}

.swiper-item{

display: flex;

flex-direction: column;

justify-content: center;

align-items: flex-start;

overflow:unset;

}

.slide-image{

height:320rpx;

width: 520rpx;

border-radius: 9rpx;

box-shadow: 0px 0px 30rpx rgba(0, 0,0,.2);

margin: 0rpx 30rpx;

z-index: 1;

}

.active{

transform: scale(1.14);

transition:all .2s ease-in 0s;

z-index: 20;

}.swiper-block{

height: 480rpx;

width: 100%;

}

.swiper-item{

display: flex;

flex-direction: column;

justify-content: center;

align-items: flex-start;