jquery - 如何在Ipad上流畅的进行一页导航？

Question

页面导航网站是一种趋势，想做一个但是用ipad总是遇到问题。网页在我的 macbook 上通常可以流畅地滚动，但在 ipad 上就很糟糕，即使只有一些图片和 css。这里有一个例子，http://jsfiddle.net/fatdogmark/YxH8r/ , 在 ipad 上移动时非常不稳定。我认为 Ipad 4 已经是所有平板电脑中性能最高的了，但性能仍然很糟糕。难道Ipad不适合单页导航网站？我希望我能在这里得到一些建议。有什么技巧或技术可以提高 ipad 的性能吗？喜欢不要使用 overflow , 不要嵌入很多 css 或 js <script src=''></script>全部在标题中(这就是我通常做的)，将它们放在 html 内联或将它们全部放在同一个文件中？或使用某种代码，如 translate3D(0,0,0)？或避免使用 transition、jquery 动画或缓动？还是有性能更好的导航插件？

我也无意中发现在Ipad上缩放实际上会激活$(window).resize(function(){//}); ...所以我在我的脚本上禁用所有 window.resize 以节省性能。

Answer 1

你应该使用这个
$btn1.style.webkitTransform = "translate3d(0px, "+ anchor1_pos + "px, 0px)";并且明显优于任何其他转换。

显然，您还必须设置它的 webkitTransition，例如“所有缓入缓出 2s”

此外，根据我的经验，您应该确保您的 DOM 不会增长太多。如果您计划拥有大量内容，您应该考虑使用 "display: none" 隐藏未使用的页面。但是因为你只想滚动一页，这让我觉得你的信息量有限，我想你应该没问题。这对我适用于 iPad1 和 2 ;)