CSS3 Transition(供应商前缀)立即使 Safari 崩溃

Question

这是我正在做的元素(代码完全复制，除了名称更改等)

https://c9.io/schwigri/strange-crash/workspace/index.html

div #logo 的样式为:

#logo {
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
}

这会导致 OS X 10.8.5 上的 Safari 6.0.5 立即崩溃。如果我删除这些转换，它不会崩溃。

我该如何解决这个问题？

Answer 1

Safari 有时会在所有-属性转换时遇到一些问题。

试试这个:

#logo {
    -webkit-transition: color .4s;
    -moz-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
}

编辑:经过更多尝试后，它实际上是您对 -webkit-transition: all 和 -webkit-calc( ) 是导致问题的原因。这是 Safari 中的错误，为了克服它，您可能需要使用 javascript 而不是 CSS 来计算上边距。

希望这对您有所帮助!