如何在iframe子元素上应用3D变换？

Question

在Phonegap 2.0.0 iOS 6.0.1应用程序中使用此处描述的技术：

http://cantina.co/2012/03/06/ios-5-native-scrolling-grins-and-gothcas/

我尝试了各种变体：

iframe * {
    -webkit-transform: translate3d(0,0,0);
}

似乎我不能将硬件加速应用于iframe中的子元素，实际上是滚动，但是以不平滑的方式生成。

如何实现iframe内容的更流畅滚动？

谢谢！

Answer 1

如果iframe显示外部网页，则无法执行此操作。

此外，您无法为iframe内容定义css规则。这是不可能的。

但是有一种替代方法jQuery，

$(document).ready(function() {
    $('iframe').contents().find("*").css("-webkit-transform","translate3d(0,0,0)");
});​

*但请不要忘记，这只适用于同一个域。