div内的iframe高度固定答案

【问题标题】：iframe inside div height fixeddiv内的iframe高度固定
【发布时间】：2012-10-23 16:50:50
【问题描述】：

我有一个带有height: 485px 的 div，我想在其中放置一个宽度为 100% 的 iframe，以便用户可以滚动 div 而不是滚动条（我这样做是因为我使用的是 CSS 滚动条）。

<div id="demo1"  style="height:485px; overflow:scroll;float: left;overflow-x: hidden;">
    <iframe height="100%" width="455px"  scrolling="no" frameborder="0" src="www" ></iframe>
</div>

我尝试将样式添加到 iframe 中，例如 style="height: auto;" 或 100%，但不起作用。

有什么建议如何检查 iframe 的高度吗？谢谢

【问题讨论】：

所以你试图使 IFRAME 成为 IFRAME 内页面的完整高度？刚刚发布的答案包含有关执行此操作的最佳方法的信息，但它不仅仅是一个 CSS 解决方案（如果我正确理解您的问题）。

标签： css html iframe

【解决方案1】：

要获取 iframe 的高度，您需要在两个窗口之间进行通信。如果您只支持 IE8+，那么使用postmessage 就很简单了。您基本上在 iframe 中使用脚本（1- iframe 内容归您所有，然后您添加脚本，或者 iframe 的所有者信任您并添加您的代码 sn-p）。

如果您想支持旧版浏览器，那么您将获得很多乐趣breaking the cross domain barrier。

但是，这确实是获得 iframe 内部高度的唯一方法。

我不确定我是否完全了解您的用例，但在我看来，您是在 iframe 中加载一个完整的网站以使用一些特殊的滚动效果吗？如果真是这样，请认真考虑其他解决方案，搞乱跨域通信以获得简单的视觉效果并不是最好的时间利用方式（加上嵌套完整网站 iframe 的性能损失）。

希望对您有所帮助！

【讨论】：