Safari 浏览器在调用新站点时停止 css 动画

Question

我有一个链接。当我单击它时，应该会出现一个div 块中的 css 动画。 但是一旦 Safari 检测到我想转到该链接，他就会停止动画并调用该网站。

我还添加了一个延迟两秒的 setTimeout(( 来证明我的假设。

动画运行两秒钟，然后调用链接并停止动画。

我在互联网上什么也没找到，所以对于这种问题。到目前为止，所有其他浏览器都通过取悦我的愿望而工作。

我知道 gif 是一种选择，但我想真正确保我的方法根本不起作用。所以我要求你确定这不是我在这里缺乏知识：-(

任何想法如何实现这一目标？

Answer 1

在 Safari 中使用关键帧时，您需要使用整个百分比：

这将：

@-webkit-keyframes keyarm {
0% { -webkit-transform: rotate(0deg); }
5% { -webkit-transform: rotate(-14deg); }
10% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(0deg); }
}

不知道为什么，但这就是Safari的工作方式！ :)