CSS3的动画直接提供一个animation-play-state属性规定动画正在运行还是暂停。写动画样式的时候特别注意下不同浏览器的兼容性,加上对应的前缀:
<前> div { animation-play-state:暂停; -webkit-animation-play-state:停顿了一下,,/*,Safari 和Chrome */} 之前只需要在对应的有动画元素节点上,通过动态增加删除这个样式就可以控制动画的开始与暂停了,非常简单。
语法
<前> animation-play-state:暂停|运行; 之前暂停规定动画已暂停;运行规定动画正在播放。
前端学习秋秋群:767273102,,有任何不明白的东西随时来问我
兼容性:
ie, Firefox以及歌剧支持animation-play-state属性.Safari和Chrome支持替代的-webkit-animation-play-state属性。
注意：
iOS 8 - 9 Safari, ios11的系统,微信里浏览器不行,动画开始就不能暂停。
解决方法使用* * -webkit-animation:没有!重要,, ,-webkit-animation-play-state:暂停;* *
<前> .no-animation { ,-webkit-animation:没有!重要; } 之前
