编程新手必备：实例代码详解

这篇文章主要介绍了陌陌小程序实现一个简单swiper代码实例,文中通过示例代码介绍的十分详尽简单小程序微信，对你们的学习或则工作具有一定的参考学习价值,须要的同学可以参考下

话不多说，上截图

HTML

css

.swiper-block {
 height: 320rpx;
 width: 100%;
}
 
.swiper-item {
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 overflow: unset;
 text-align: center;
}
 
.slide-image {
 height: 230rpx;
 width: 526rpx;
 border-radius: 10rpx;
 box-shadow: 0px 3px 10px 0px rgba(51, 51, 51, 0.3);
 margin: 0 rpx 30rpx;
 z-index: 1;
}
 
.active {
 transform: scale(1.21);
 transition: all 0.2s ease-in 0s;
 z-index: 20;
}

js

swiperChange(e) {
 const that = this;
 that.setData({
  swiperIndex: e.detail.current,
 })
},

以上就是本文的全部内容简单小程序微信，希望对你们的学习有所帮助，也希望你们多多支持脚本之家。