在 A 网站的页面中,用 iframe 嵌入一个来自 B 网站的子页面,怎么控制 iframe 子页面自适应高度?
比如,在 A 网站的 index.html 中,用 iframe 嵌入一个 B 网站的 child.html 子页面:
<iframe id="iframe_id" height=100% width=100% src="http://B.com/child.html" scrolling="no" frameborder=0></iframe>
(由于 child.html 是动态高度的)然后在上面这段代码下面,添加 JavaScript 来修改 iframe 高度:
<script type="text/javascript">
var x = document.getElementById("iframe_id");
x.height=document.documentElement.clientHeight;
</script>
修改 iframe 的高度之后,child.html 页面下半截还是被遮住(显示不完全)。把 clientHeight 改成 scrollHeight 也一样不能完全显示 child.html 的全部高度。
1
hjdtl 2017-05-04 15:02:09 +08:00
把 overflow 设置为 scroll 试一下
|
2
J0k3r 2017-05-04 15:16:00 +08:00
<iframe width="100%" border="0" marginwidth="0" marginheight="0" frameborder="0" scrolling="no"
src="http://B.com/child.html" onload="this.height=document.documentElement.clientHeight"> </iframe> |
3
rogwan OP |
4
yoonper 2017-05-04 23:34:23 +08:00 via iPhone
跨域 IFRAME 自适应高度
http://www.yoonper.com/post.php?id=26 |
6
Kokororin 2017-05-05 07:13:09 +08:00 via iPhone
window.postMessage
|