关闭

Iframe自动适应宽度和高度

72人阅读 评论(0) 收藏 举报
分类:
 Iframe自动适应宽度和高度
 <iframesrc="Guestbook/index.asp?ver=cn&classid=1"id="newsiframe" marginwidth="0" marginheight="0" frameborder="0"scrolling="no" width="100%" onload="this.height=0;varfdh=(this.Document?this.Document.body.scrollHeight:this.contentDocument.body.offsetHeight);this.height=(fdh>10?fdh:10)"></iframe>
 
一般样式:
<iframe src="index_center.asp?adminid=3"height=205 width=285 frameborder=0 scrolling=no border="0"></iframe>




 Iframe自动适应高度(要在同一个域名下,引用别人网址是不行)
最好是在本地测试:
<!DOCTYPE html>
<html lang="sv">
<head>
	<meta charset="utf-8" />
	<title>Iframe height demo</title>
	<style media="screen,print">
	#body {
		width:70em;
		max-width:100%;
		margin:0 auto;
	}
	iframe {
		width:100%;
		margin:0 0 1em;
		border:0;
	}
	</style> 
</head>
<body>
	<div id="body">
		<iframe src="type.php" frameborder="0" scrolling="no" id="test" onload="this.height=100"></iframe>
		<script type="text/javascript">  
    function reinitIframe(){  
        var iframe = document.getElementById("test");  
        try{  
            var bHeight = iframe.contentWindow.document.body.scrollHeight;  
            var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;  
            var height = Math.max(bHeight, dHeight);  
            iframe.height =  height;  
            console.log(height);
        }catch (ex){}  
    }  
  
    window.setInterval("reinitIframe()", 200);  
</script>
	</div>
</body>
</html>

引用:http://caibaojian.com/iframe-adjust-content-height.html

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:358246次
    • 积分:4371
    • 等级:
    • 排名:第6916名
    • 原创:775篇
    • 转载:137篇
    • 译文:1篇
    • 评论:20条
    最新评论