Question

我正在开发一个iPhone优化的网站，并在Windows上的Safari 3.1.2上进行测试。对于网站中的一些元素，我使用-webkit-transition样式来应用隐式动画。

基本上，我有这样的元素：

<div style="-webkit-transition: left 2s linear;">...</div>

有时从一开始就存在于文档中，有时从另一个文档加载并注入DOM。

在第一种情况下，动画按预期发生，但是当使用JavaScript注入div时，-webkit-transition似乎被忽略（没有动画）。此外，在Safari的检查员中我可以看到：

-webkit-transition: condensed 2s linear;

这个condensed是什么意思？如何在注射后强制使用该样式？

任何线索都会受到赞赏。

Answer 1

您可能想尝试使用Safari 4 beta for Windows。正如Apple所说：

“Safari 4是Mac和Windows上速度最快，效率最高的浏览器，可以很好地集成HTML 5和CSS 3 Web标准，支持下一代交互式Web应用程序。”

所以你可能对Safari 4很幸运，试试吧。

Answer 2

我没有做过很多这方面的事情，但我看到桌面和Mobile Safari之间存在差异（例如How do I make an element scale down to nothing using a CSS transition on the iPhone?）。

因此，我认为您需要使用iPhone或iPod Touch进行测试。