animation-play-state在ios中失效无法解决,又不能直接操作wxml,怎么解决?
index.js
Page({
data: {
playing:false
},
bingclick: function (e) {
if (this.data.playing) {
this.setData({ playing: false })
} else {
this.setData({ playing: true })
}
}
})
index.wxml
<!–index.wxml–>
<view class=“container”>
<label>点击红色正方形(旋转/暂停)</label>
<view class=“kuang” style=“animation-play-state:{{playing?‘running’:‘paused’}} !important” bindtap=“bingclick”></view>
</view>
index.wxss
/**index.wxss**/
@keyframes circle{0%{transform: rotate(0deg)}100%{ transform: rotate(360deg)}}
.kuang{
margin: 160rpx auto 0;
position: relative;
z-index: 10;
width: 400rpx;
height: 400rpx;
-webkit-animation: circle 20s linear infinite;
-moz-animation: circle 20s linear infinite;
animation: circle 20s linear infinite;
background-color: red;
}