最近工作中有项目要使用微信小程序技术进行开发,其中一项功能困扰了我很久,卡片滑动动效以及手势识别。经过一番研究和参考,现在把成果展示。记录自己踩到的坑,如果大家有需要,也可以帮助到大家。 效果图: 首先是卡片布局的实现: 图片(一) 如图所示,我采用绝对定位absolute的方式,辅助index,可以实现卡片的层叠效果。注意:三张卡片一定都是相同的定位,否则index可能不起作用。 代码: //设置position: absolute; left:50%;后,再 margin-left:负(一半的width);可以实现水平居中 //同理,设置top:50%;margin-top:负(一半