手机版

微信小程序捣蛋鬼实现滑动放大缩小效果

时间:2021-08-28 来源:互联网 编辑:宝哥软件园 浏览:

效果图如下所示:

具体代码如下所示:

swiper class=' swiper-block ' previous-margin=' 90 rpx ' next-margin=' 90 rpx ' current=' 0 ' bind change=' swiper change ' block wx : for=' { { imgUrls } } ' wx : index=' { { index } } ' swiper-item class=' swiper-item ' image mode=' aspectFill ' src=' http3: { { item } } ' class=' slide-image { { swiper }swiper-block { height : 480 rpx;宽度: 100%;}.swiper-item { display : flex;弯曲方向:柱;正义-内容:中心;align-items : flex-start;飞越:未设置;}.幻灯片图像{ height:320rpx宽度: 520 rpx边界半径: 9 rpxbox-shadow : 0px 0px 30rpx rgba(0,0,0,2);margin : 0 rpx 30 rpxz-index : 1;}.有源{transform:标度(1.14);全部转:2s轻松进入0s;z指数: 20;}.swiper-block { height : 480 rpx;宽度: 100%;}.swiper-item { display : flex;弯曲方向:柱;正义-内容:中心;align-items : flex-start;飞越:未设置;}.幻灯片图像{ height:320rpx宽度: 520 rpx边界半径: 9 rpxbox-shadow : 0px 0px 30rpx rgba(0,0,0,2);margin : 0 rpx 30 rpxz-index : 1;}.有源{transform:标度(1.14);全部转:2s轻松进入0s;z指数: 20;} Page({ data : { imgurls :[' http://img 02。太开放了。com/images/20150928/tooopen _ sy _ 143912755726。jpg ',' http://img06.tooopen.com/images/20160818/tooopen _ sy _ 175866434296。jpg ',' http://img 06。太开放了。com .那个。setdata({ Swiperindex : e . detail。当前,})})总结

以上所述是小编给大家介绍的微信小程序捣蛋鬼实现滑动放大缩小效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

版权声明:微信小程序捣蛋鬼实现滑动放大缩小效果是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。