iframe自适应高度
浏览量:419
这里有两种常用的方法来解决此问题：
----------第一种方法----------------------------------------------------------------------------------------------------------------
//html 代码
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="http://m13146686224.blog.163.com/blog/jquery-1.9.1.min.js"></script>
<div id="leamain">
<iframe src="http://m13146686224.blog.163.com/ceshi.php" marginheight="0" marginwidth="0" frameborder="0" scrolling="no" width="300" height=100% id="iframepage" name="iframepage" onLoad="iFrameHeight()" style="border:1px solid red;">
</iframe>
</div>
</body>
//jquery 代码技术
<script type="text/javascript" language="javascript">
function iFrameHeight() {
var ifm= document.getElementById("iframepage");
var subWeb = document.frames ? document.frames["iframepage"].document :
ifm.contentDocument;
if(ifm != null && subWeb != null) {
ifm.height = subWeb.body.scrollHeight;
}
}
</script>
</html>IE 火狐 谷歌浏览器都适应。
----------第二种方法----------------------------------------------------------------------------------------------------------------
<iframe id="runtime" name="runtime" src="http://m13146686224.blog.163.com/blog/ceshi.php" frameborder="0" scrolling="no" style="border:0px;width:620px;" onload="autoHeight();"></iframe>
<script type="text/javascript">
function autoHeight(){
var iframe = document.getElementById("runtime");
if(iframe.Document){//ie自有属性
iframe.style.height = iframe.Document.documentElement.scrollHeight;
}else if(iframe.contentDocument){//ie,firefox,chrome,opera,safari
iframe.height = iframe.contentDocument.body.offsetHeight ;
}
}
</script>
神回复
发表评论:
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。