jquery - CSS3 过渡 v jQuery 动画 - 强大的方法？

Question

这个问题之前已经被问过，但与性能有关。SO 的答案省略了在 IE 上实现的问题。

我接受 CSS3 过渡比 jQuery 动画更快。

但是我注意到 CSS3 在 IE 6-8 中遇到了问题，因此需要使用像 ie9.js 或 select[ivizer] 这样的插件。两者在 SO 和其他地方都有不同的写作。

因此，我想在这里澄清一下。据我了解，jQuery animate 将跨浏览器及其版本进行规范化。

因此，即使回顾 ie-8 也是使用 jQuery 的最佳建议，而不管速度方面有什么影响？

score 1 · Accepted Answer

这有点个人意见和个人需求的问题，

如果跨浏览器支持是一个问题，我的建议是坚持使用 jQuery，因为 CSS3 仍然在跨浏览器快速变化。尽管 CSS3 在各种基准测试中确实证明更快。

或者，您可以使用使用 CSS3 转换的专用插件，并在找到不受支持的属性时回退到动画，一个好的插件是jQuery Transit，尽管它没有满足所有需求的完整解决方案。

score 1 · Accepted Answer

jQuery 使用 window.setTimeout(); 动画元素在最佳情况下，您可以获得 60 FPS。

这还不够好，而 CSS3 对动画使用硬件加速。

如果你认为你不应该被困在 jQuery Animation 上。

用户 moderinzr 检查 CSS 过渡而不是使用 CSS3。

如果不支持 CSS3，我认为TweenMax是比 jQuery 更好的动画方法。

PS：我建议你阅读这篇文章。

score 1 · Accepted Answer

尽可能使用 CSS 过渡，在旧浏览器上使用 jQuery animate，或者在事情变得太复杂而无法轻松实现过渡的地方。

CSS 过渡不再改变（从一开始就没有改变），因为它们在某些浏览器中是在没有前缀的情况下实现的。

如果您喜欢 jQuery animate 的工作方式，可以在此处找到替换项：

这在可能的情况下智能地使用了过渡，这意味着您可以像往常一样编写 jQuery，但您会从新浏览器中更好的动画中受益。

根据我的经验，该插件有时工作得非常好，并且时不时地完全破坏了一切——你应该在生产中使用之前仔细测试 CSS 过渡版本是否正确。（例如某些动画上的 jQuery Cycle break 之类的东西）

score 0 · Accepted Answer

你可以使用.animate()，这有点困难，但我找到了一个让你的工作变得轻松的插件。

这个插件给你平滑的过渡。我检查了 IE 9，它工作正常。

4 回答 4