前端之家收集整理的这篇文章主要介绍了
jquery – 动画播放状态:在safari 11中运行不起作用,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
首先元素具有属性animation-play-state:paused,然后脚本修改为属性animation-play-state:running.所有浏览器都处理该任务,但Safari 11不会启动动画.
有什么问题?我该如何解决这个任务?
最佳答案
我遇到了同样的问题:我的动画最初暂停,然后通过JS设置为“运行”.这适用于除Safari之外的所有现代浏览器.
我的解决方案是重构/反转暂停/运行逻辑 – 我将初始/默认状态保持为“正在运行”,而不是“暂停”.然后我根据需要添加并删除了我的“暂停”课程.我不再在我的css中的任何地方切换“运行”状态,只有一个处于“暂停”状态的类.
以下设置现在适用于Safari:
.fancyEl {
animation: fancyAni ease-in-out 1.5s infinite;
}
.fancyEl.paused {
animation-play-state: paused;
}