我目前正在制作一个带有一些css动画的登陆页面（非常基本的淡入淡出）。我最初在我的css文件中设置animation-play-state: "paused"，稍后在滚动页面时使用jQuery访问它，以触发动画。
在Mac上的Chrome上工作得很好，但尝试从我的iPhone上的 Safari和Chrome 运行它似乎不起作用。
我检查了控制台日志，并根据我的想法进行了调试，一切似乎都有效，但实际的动画没有运行（但是animation-play-state 正在改变到{{1 }}
要添加的最后一件事，如果我将"running"语句放在$(".row").css("animation-play-state", "running");语句之前，它就会完全按照它应该执行的操作。
我的jQuery语句是：
if有谁知道这个问题？非常感谢提前！ NIV
答案 0 :(得分：0)
今天解决了这个问题。我正在更改animation-play-state，以创建漂亮的显示动画。
还定义了animation-fill-mode: both;。
我使用了这样的关键帧
@keyframes fade {
from { opacity: 0; }
to { opacity: 1; }
}
在Safari中似乎没有任何帮助。经过测试的版本是 11.1.2（13605.3.8）（目前稳定）和 Safari技术预览版63（Safari 12.1，WebKit 13607.1.2.1），在Macbook上和iPhone一样-结果相同，没有动画播放。
TL.DR。您不能简单地在Safari中更改animation-play-state。尝试更改animation-name属性
我很幸运地使用opacity和transform来揭示元素，所以这个古怪的临时动画名称对我有帮助：
@keyframes be-hidden {
from { opacity: 0; }
to { opacity: 0.0000001; }
}
@keyframes fade {
from { opacity: 0; }
to { opacity: 1; }
}
div {
animation-name: be-hidden;
animation-duration: 600ms;
animation-fill-mode: both;
animation-delay: 500ms;
animation-iteration-count: 1;
}
div.revealed {
animation-name: fade;
}
将animation-name设置为一些临时动画，该动画将隐藏元素，然后将其更改为其他（.revealed类）
如果还有其他方法可以解决此问题，我将很高兴看到它。