新网创想网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
这篇文章主要介绍了微信小程序如何实现一个swiper,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。
成都创新互联公司专注于中大型企业的网站制作、成都网站建设和网站改版、网站营销服务,追求商业策划与数据分析、创意艺术与技术开发的融合,累计客户上千余家,服务满意度达97%。帮助广大客户顺利对接上互联网浪潮,准确优选出符合自己需要的互联网运用,我们将一直专注品牌网站制作和互联网程序开发,在前进的路上,与客户一起成长!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, }) },
感谢你能够认真阅读完这篇文章,希望小编分享的“微信小程序如何实现一个swiper”这篇文章对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,更多相关知识等着你来学习!