iPad 1上CSS3过渡效果出现卡顿/闪烁问题（附例）？

Question

3

在我们的工作项目中，我们需要制作一个iPad HTML5。使用Backbone和jQuery Mobile，我们认为我们会成功，但是jQuery Mobile似乎引起了更多问题。使用jQuery Mobile的页面转换非常缓慢、卡顿和出现故障（我知道它仍处于Alpha版本）。

对于我们的需求，我们希望页面之间的过渡更加流畅。我开始进行一些实验，看看是否能够为定制解决方案找到更好的方法。我感觉我已经很接近了，但动画仍然看起来很卡顿和出现故障。我想知道是否有其他方法来解决这个问题？或者是否有任何信息可以帮助我们使其更加稳定？

我正在使用translateX()/translateY() CSS3（硬件加速）变换来确保它获得最佳性能，但它的性能仍然不可靠。有时它可以正常工作，有时则不能。

我已经上传了一个示例...请注意，这仅在Chrome / Safari中进行了测试（看起来很好），以及第一代iPad上的Mobile Safari（看起来很卡顿）。如果您恰好有一个iPad，请查看此示例...

这是一个基本插件，因为一旦我掌握了这个技能，我想进一步开发它。

有人可以帮忙吗？我只是想知道为什么在iPad上仍然不流畅？

更新：我尝试使用translate3d()以及translateX和translateY()，但没有任何区别。

- littlejim84

这方面有任何进展吗？我也在为iPad HTML5“应用”使用jQuery移动框架。如你所说，过渡效果很糟糕，出现卡顿和故障。 - nitech

和你一样，我在开发JavaScript方面遇到了同样的问题，只不过是在iPad上。我也非常有兴趣找到解决方案。 - user804271

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- mike.helgeson · Accepted Answer

iPad只支持硬件加速3D变换。您应该使用translate3d并提供第三个参数，将其设置为零。