日期:2014-05-16  浏览次数:20336 次

iframe 高度自适应问题
百度谷歌了一番,找到的代码,经过测试后都不奏效。


以下是普通的代码,不会根据内容来调整iframe的高度。
HTML code

<html>
<body>
<iframe id="main_frame" frameborder="0" scrolling="no" width="100%" src="http://baidu.com"></iframe>
</body>
</html>




要求就是:
让iframe的高度自动适应内容的高度.

------解决方案--------------------

这么写:
<iframe id="main_frame" frameborder="0" onload="iframeFitHeight(this);" scrolling="no" width="100%" src="http://baidu.com"></iframe>


function iframeFitHeight(oIframe) {
//Iframe窗口自适应高度 兼容IE6.0 FF2.0以上
try {
var oWin = oIframe.name ? window.frames[oIframe.name] : oIframe.contentWindow;
oIframe.style.height = oWin.document.body.scrollHeight + "px";
} catch(e){}
}
------解决方案--------------------
你的这个是跨域了。以http:开头的,是跨域了,你把那个src改成本地的一个html页面,测试一把,是没有问题的。至于跨域,还的找找这方面的代码。
------解决方案--------------------
跨域也有方法的。http://www.chinaz.com/web/2011/1123/222158.shtml
------解决方案--------------------
播放背景音乐,采用frameset比较简单,把播放页面的高度设置为0

也即是
<frameset rows="0,*">
<frame src="play.aspx"/>
<frame src="显示页面.aspx"/>
</frameset>