CSS 剪辑路径在 Safari 中加载失败

Question

我一直在玩 CSS clip-path 属性，并让这支笔为 Logo 制作动画:http://codepen.io/alexcoady/pen/PqJavW .该代码绘制了一些 div，并根据我生成的一些三 Angular 形动态地将 clip-path 应用于它们。

这在 Chrome(43.0.2357.124(64 位))中按预期工作。

然而，在 Safari (8.0.4 + iOS) 中，什么也没有显示。打开检查器后，我可以取消选中 clip-path 属性，然后重新选中它 - 路径按预期可见。

有什么想法可以确保 Safari 第一次渲染这些路径吗？

谢谢。

Answer 1

我相信只有 Chrome 支持动画剪辑路径。

我也为这个问题寻找了解决方案，但我能找到的最接近的解决方案是目前只有 Chrome 可以为 SVGElement 的点设置动画。

这里有几个地方可以寻找解决方案。

https://developer.mozilla.org/en-US/docs/Web/CSS/transition-property http://www.w3.org/TR/SVG11/shapes.html#PolygonElement