CSS 更改 ipad 上加速的元素硬件的高度答案

【问题标题】：CSS change height of element hardware accellerated on ipadCSS 更改 ipad 上加速的元素硬件的高度
【发布时间】：2012-10-05 10:17:13
【问题描述】：

在 iPad 上开发 HTML5 应用程序我想更改硬件加速元素的高度。

我在子元素（绝对定位，大于父元素）上创建了一个视口（父元素，溢出：隐藏），扩展视口的高度应该会显示子元素的更大部分。

动画在我的桌面浏览器 (Chrome) 上看起来非常漂亮，但在我的 iPad (iOS 6) 上运行时，动画就不那么流畅了。

下面的 JSFiddle 说明了这个问题：

http://jsfiddle.net/schade/bqsnS/（使用 iPad 查看问题，使用 Chrome 查看应该如何工作）

我已经调试了 iPad，我的结论是它做了很多重排，现在我的结论是，无论我如何设置位置，父元素的高度总是会强制重绘 iPad 上的子元素的子元素。要么？

有没有人能解决这个问题？

或者某种不错的解决方法？

【问题讨论】：

【解决方案1】：

据我了解，您可以通过应用以下样式来强制对 iOS 上 CSS3 中的元素进行硬件加速：

    -webkit-transform: translateZ(0);

希望对你有帮助

【讨论】：