Question

如果您查看我的页面http://debourg-dev.ch/crea/，您会看到我的链接上的过渡效果在Safari中不起作用（在Mac上的最新版本上测试过）。我的代码如下：

a {
    color: inherit;
    text-decoration: none;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

有什么问题？

Answer 1

似乎Safari在transition: all;（或只是transition: Xs;上有一个错误和窒息，因为＆＃39; all＆＃39;是默认属性）。它甚至会破坏某些版本的桌面和iOS Safari。

解决方案：将其更改为transition: color 0.5s ease-in-out; （或者，当然任何其他财产，只要确保它不是全部的。）

特别是将过渡全局应用于锚标签也可能是一个问题 - 了解更多here

有关Safari crashing

的更多信息

here

Answer 2

在运行OSX 10.9.1和Safari 7.0.1时，转换似乎对我有用。如果我不得不猜测，问题可能是由于缓存。尝试清除缓存并查看问题是否仍然存在。

Answer 3

对于Safari，请尝试以下操作：

-webkit-transition: 190ms width linear;

其中width表示要更改的属性，阻止使用all，因为不同的浏览器会以不同的方式解释它，并且可能会导致问题，特别是在Safari浏览器中。

css过渡不适用于safari

3 个答案: