Safari中的动画剪辑路径不起作用

时间:2019-07-19 09:30:59

标签: css safari css-animations clip-path

我正在制作一个clip-path属性的简单CSS动画,使用基本的inset形状来创建扫掠效果。在Chrome和Firefox中效果很好,但在Safari中效果不佳。

如果我调整Safari窗口的大小或执行其他强制重绘的操作,则它会渲染动画的当前状态。因此,这似乎是动画无法正确重绘的问题。

我相信您需要在我的-webkit-前面加上clip-path前缀。

我正在使用Safari的最新版本:12.1.1

以下是说明问题的小提琴: https://jsfiddle.net/vwth9mjr/

我希望动画能够像在Chrome和Firefox中一样工作。

Safari没有显示错误消息。

1 个答案:

答案 0 :(得分:1)

.pane css从固定更新为绝对似乎可行:

https://jsfiddle.net/d32bm6jo/5/