我目前正在为 iPad Safari 开发一个使用 HTML5 和 jQuery 的 Web 应用程序。我遇到了一个问题,其中较大的滚动区域会导致屏幕外的元素在我向下滚动到它们时出现延迟。
我的意思是,如果我有一排屏幕外的图像(甚至是带有渐变的 div),当我向下(或向上)滚动到它时,预期的行为 是让元素在我滚动到它时出现在屏幕上。
但是,元素不会出现,直到我将手指从屏幕上移开并且滚动条完成其所有动画。
这给我造成了一个非常明显的问题,使整个事情看起来波涛汹涌,尽管事实并非如此。我猜 iPad Safari 正在尝试做一些事情来节省内存。有什么办法可以防止这种波动的发生吗?
此外,iPad Safari 究竟想要做什么?
最佳答案
您需要欺骗浏览器以更有效地使用硬件加速。你可以用一个空的三维变换来做到这一点:
-webkit-transform: translate3d(0, 0, 0)
特别是,您需要对具有 position:relative;
声明的子元素进行此操作(或者,全力以赴,对所有子元素执行此操作)。
这不是一个有保证的修复,但它在大多数情况下都相当成功。
帽子提示: iOS 5 Native Scrolling–Grins & Gotchas
https://stackoverflow.com/questions/9807620/