Question

我们已经构建了一个HTML5应用程序，可动态加载iFrame以显示外部内容。这个解决方案工作正常，直到android 4.0的发布 - 这似乎改变了iframe渲染的工作方式？

它似乎无法再检测到高度，它显示了一个小的可滚动框，其中包含大约50px高度的900px高页面。我已经尝试将高度设置为100％ - 这在视觉上有效 - 但是应用程序会在页面下方的任何内容上获得奇怪的点击结果！

如果我手动设置每个帧的高度，它工作正常 - 但由于动态内容，这是非常不切实际的。此外，由于应用程序在iframe中具有一定级别的内部导航 - 子页面可以是单独的高度到原来的iframe高度 - 再次在以前版本的Android中运行良好。

有人有任何建议/解释吗？

Answer 1

万一你仍然被卡住了，我刚刚发现了这个解决方法......

<iframe src='externalcontent.htm' width='100%' scrolling='no' frameBorder='0' id='theiFrame' onLoad='fixiFrame();'></iframe>

function fixiFrame () {
   if ((android) && (androidVersion > 3)) {
      iFrameContentHeight = document.getElementById('theiFrame').contentDocument.body.offsetHeight;
      document.getElementById('theiFrame').style.height = iFrameContentHeight + 'px';
   }
}

Answer 2

这适用于Android 4和5：

document.getElementById('theIframe').style.height = document.getElementById('theParent').offsetHeight + 'px';

别忘了＆＃39; + px＆＃39;

Phonegap HTML5 / Android App - Iframe高度问题

2 个答案: