我的问题:
我有一个链接到各种外部网站的 iframe。
我根本无法访问外部网站!
我想要实现的是将我的 Iframe 与实际网站的 100% 高度/宽度嵌套到一个固定大小的 div 中，这样我就可以在这个 div 上应用自定义滚动条。
到目前为止，我有以下标记:
<div class="Content" style="margin: 0; padding: 0; height: 500px; width: 500px; overflow: auto;">
<iframe id="mainframe" name="mainframe" src="http://www.fisk.dk" style="height: 100%; width: 100%;">
</iframe>
</div>
正如预期的那样，Iframe 高度和宽度 100% 将转换为父 div 高度和宽度 500px。
在过去的 3 个小时里，我一直在谷歌上搜索，试图弄清楚如何通过使用纯 css 或 css 和 javascript 来实现这一点，但没有任何结果。
无效的结果:
- Porthole - 需要访问外部网站。
- EasyXDM - 需要访问外部网站。
- 访问 document.getElementById('the_iframe').contentWindow 也不起作用 - 出现拒绝访问错误。
如有任何提示，我们将不胜感激!
最佳答案
在使用 EasyXDM 和 PostMessage 之前，我已经完全按照您的描述做了.正如您所注意到的，需要访问外部网站。您需要一些在外部网站域上运行的 JavaScript 代码。
浏览器不允许您网站上的 JavaScript 或 CSS 代码访问其他网站的 DOM，因此无法知道其他网站页面的高度。
关于javascript - 跨域 Iframe 高度操作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15764509/