html - 过渡适用于 Chrome 和 Firefox，不适用于 Safari

Question

我使用了这段代码:

codepen.io/egrucza/pen/PwbzPy

它似乎适用于 Chrome 和 Firefox，但不适用于 Safari。我添加了 Modernizr，但这对我没有帮助。 Safari 中的三 Angular 形在没有悬停的情况下是可见的，并且位置很奇怪。悬停不执行任何操作。

有什么快速修复方法吗？

Answer 1

很可能是因为您使用了 transform::rotate(-45deg) translateX(0);，它需要在 Safari 上使用供应商前缀。尝试添加:

-webkit-transition: -webkit-transform 200ms ease;
-webkit-transform: rotate(-45deg) translateX(0%);