iPad Safari（iOS 5.0.1）上的iframe CSS3扩展问题

我需要放大iframe以使其更大（我无法控制iframe内容的源代码）。我试图通过

-webkit transform:scale（1.3）

CSS属性来实现它

iframe的内容已正确放大，但当我尝试触摸iframe中的任何控件时，似乎在错误的位置接收到触摸事件（我可以看到触摸时控件的“阴影”在错误的位置高亮显示）。因此，事件处理程序无法工作（我怀疑它们没有被调用，因为触摸在错误的位置被检测到）。有人遇到过这个问题吗？可以解决吗

我创建了一个产生问题的测试用例（在iPad Safari中尝试）：

源文件采用更可读的格式：

父页面（iframe的容器）：

父母亲
iframe
{        
左：200px；
-webkit转换：规模（1.3）；
}
父母亲

子页面（iframe内容）：

小孩
小孩
按钮

这感觉像是一个黑客解决方案，但由于它正在修复看似存在的bug，我想这并不重要。我没有在2D中缩放，而是在3D中将iframe移向了查看器，请参见此演示：

被制作成3D空间，如下所示：

body {
 -webkit-perspective: 800px;
}

然后，iframe在该3D空间中沿Z轴向查看器移动：

iframe {
    -webkit-transform: translateZ(130px);
}

---

对于实际应用程序，这可能需要修改，特别是如果iframe不是用

包装的，更容易的是使iframe具有响应性，因此如果浏览器调整大小，响应的内容也是如此……这可能会修复它，因为缩放似乎只是缩放帧，而不是在其中重新调整内容

---

让我知道我离你要找的东西有多近，请用任何想法或修复方法发表评论。

iOS 5上的iframe实现有一些bug，你可以在中看到，即使你没有使用phonegap，你也可以找到有用的提示，因为它是基于HTMS/JS/CSS的。我引用该文件的最后一段：

在iOS 5及更高版本上使用本机滚动时，iFrame可能会干扰并导致滚动手势被错误解释。这是Apple实现中的一个bug，唯一的解决方法是避免使用iFrame或使用不同的滚动库（如iScroll）

---

您也尝试过Javascript解决方案，我认为可以从父窗口将CSS文件注入iframe上的HTML，因为最后它都加载在DOM中

不幸的是，当我尝试水平放置iframe时，此解决方案产生的问题与我最初的帖子中的问题相同。我也尝试过设置左边距和translateX。你的帖子没有提到水平放置iframe。你能提供一个更新的演示和你想要达到的目标的解释吗？不知道为什么这会收到投票。即使在iOS7上，它也不能解决问题：嘿，卡霍恩，你解决过这个问题吗？我现在正在调查这件事。如果你解决了这个问题，你能更新一个答案吗？@djburdick：我还没有解决这个问题。我不得不求助于将缩放CSS代码放入iframe的内容中（必须与第三方协商）。如果您无法修改iframe的源代码，这当然对您没有帮助。

body {
 -webkit-perspective: 800px;
}

iframe {
    -webkit-transform: translateZ(130px);
}