All*_*lan 64 javascript iframe autosize
可能重复:
根据内容调整iframe大小
我正在加载iFrame并希望父级根据iFrame内容的高度自动更改高度.
简而言之,所有页面都属于同一个域,因此我不应该遇到跨站点脚本问题.
Oli*_*Oli 38
在任何其他元素上,我将使用scrollHeightDOM对象并相应地设置高度.我不知道这是否适用于iframe(因为它们对所有内容都有点怪异),但它确实值得一试.
编辑:浏览过后,流行的共识是使用以下内容在iframe中设置高度offsetHeight:
function setHeight() {
parent.document.getElementById('the-iframe-id').style.height = document['body'].offsetHeight + 'px';
}
并附加与iframe-body的onLoad事件一起运行.
Shr*_*hna 10
我碰巧遇到了你的问题,我有一个解决方案.但它在jquery.它太简单了.
$('iframe').contents().find('body').css({"min-height": "100", "overflow" : "hidden"});
setInterval( "$('iframe').height($('iframe').contents().find('body').height() + 20)", 1 );
你去!
干杯! :)
编辑:如果你有一个基于iframe方法的富文本编辑器而不是div方法,并希望它扩展每一个新行,那么这段代码将完成所需.
小智 8
这是一个死的简单解决方案,适用于每个浏览器和跨域:
首先,这适用于以下概念:如果包含iframe的html页面设置为100%的高度,并且使用css将iframe设置为100%的高度,那么css将自动调整所有内容的大小.
这是代码:
<head>
<style type="text/css">
html {height:100%}
body {
margin:0;
height:100%;
overflow:hidden
}
</style>
</head>
<body>
<iframe allowtransparency=true frameborder=0 id=rf sandbox="allow-same-origin allow-forms allow-scripts" scrolling=auto src="http://www.externaldomain.com/" style="width:100%;height:100%"></iframe>
</body>
| 归档时间： |
|
| 查看次数： |
182098 次 |
| 最近记录： |