css rotateY iOS
- 当前 Bug 的表现（可附上截图） 是一个会员卡的翻转效果： 我的做法是，一个view包含两个view （分别充当会员卡的正面和反面，对反面进行初始化翻转180deg，并且隐藏）。 动画加在外层view上。当动画完成后，对里面的正反面进行显示隐藏的交换。 bug：动画完成后，反面会员卡view变为一片空白。但是点击对应区域，还有响应。（卡片背面有对应的手机号，点击可以打电话） 安卓和模拟器都没毛病。iOS就有问题。 js 从正面->反面 var animation = wx.createAnimation({ duration: 500, timingFunction: 'linear', }) animation.rotateY(90).opacity(0.5).step() animation.rotateY(180).opacity(1).step() this.setData({ animationData: animation.export() }) var that = this; setTimeout(function() { that.setData({ cardFrontShow: "flex", cardBackShow: "none", cardFrontRotateY: '-180', cardBackRotateY: '0' }); }, 500); html <view class='card' animation="{{animationData}}"> <!-- 卡正面 --> <view id='cardFront' bindtap='showCardBack' style='display: {{cardFrontShow}}; transform: rotateY({{cardFrontRotateY}}deg); background-image: url({{cardInfo.styleUrl}});'> </view> <!-- 卡背面 --> <view id='cardBack' bindtap='showCardFront' style='display: {{cardBackShow}}; transform: rotateY({{cardBackRotateY}}deg); background-image: url({{cardInfo.styleUrl}});'> </view> </view>
