iframe 自动延伸的几种方法尝试_iframe 根据浏览器自动扩展-优快云博客

本文链接：https://blog.youkuaiyun.com/bjut_yue/article/details/19608123

主界面and 几种js方法：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
.left{width:200px;height:500px; background:#9FC; float:left;}
.right{width:400px;-height:600px; -background:#0F3; float:left;}
</style>
<script src="jquery-1.8.2.min.js"></script>
<script>
/*function SetWinHeight(obj) { 
	var win=obj; 
	if (document.getElementById) { 
		if (win && !window.opera) { 
			if (win.contentDocument && win.contentDocument.body.offsetHeight) 
				win.height = win.contentDocument.body.offsetHeight; 
			else if(win.Document && win.Document.body.scrollHeight) 
				win.height = win.Document.body.scrollHeight; 
		} 
	} 
} */
/*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; 
	} 
} */


/*
function dyniframesize(down) { 
	var pTar = null; 
	if (document.getElementById){ 
		pTar = document.getElementById(down); 
	} 
	else{ 
		eval('pTar = ' + down + ';'); 
	} 
	if (pTar && !window.opera){ 
		//begin resizing iframe 
		pTar.style.display="block" 
		if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight){ 
			//ns6 syntax 
			pTar.height = pTar.contentDocument.body.offsetHeight +20; 
			pTar.width = pTar.contentDocument.body.scrollWidth+20; 
		} 
		else if (pTar.Document && pTar.Document.body.scrollHeight){ 
			//ie5+ syntax 
			pTar.height = pTar.Document.body.scrollHeight; 
			pTar.width = pTar.Document.body.scrollWidth; 
		} 
	} 
} */
function SetCwinHeight() { 
	var iframeid = document.getElementById("maincontent1"); //iframe id 
	iframeid.height = "10px";//先给一个够小的初值,然后再长高. 
	if (document.getElementById) { 
		if (iframeid && !window.opera) { 
			if (iframeid.contentDocument && iframeid.contentDocument.body.offsetHeight) { 
				iframeid.height = iframeid.contentDocument.body.offsetHeight; 
			} else if (iframeid.Document && iframeid.Document.body.scrollHeight) { 
				iframeid.height = iframeid.Document.body.scrollHeight; 
			} 
		} 
	} 
} 

</script>
</head>

<body>
<div>
	<div class="left"></div>
    <div class="right">
    	<!-- 
    	<iframe src="2.html" width=100% align="center"  id="win" name="win" οnlοad="Javascript:SetWinHeight(this)" frameborder="0" scrolling="no" ></iframe>
        
        <iframe src="2.html" id="iframepage" name="iframepage" frameBorder=0 scrolling=no width="100%" onLoad="iFrameHeight()" ></iframe>
       
        <iframe src="2.html" frameborder="0" marginheight="0" marginwidth="0" frameborder="0" scrolling="auto" id="ifm" name="ifm" οnlοad="javascript:dyniframesize('ifm');" width="100%">
</iframe>
	 -->
     <iframe style="z-index: 1; visibility: inherit; width: 100%;" name="maincontent1" 
οnlοad="Javascript:SetCwinHeight()" height="1" id="maincontent1" src="2.html" 
marginwidth="0" marginheight="0" frameborder="0" scrolling="no"></iframe> 
    </div>
</div>
</body>
</html>

子界面就是赋值了一个高：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
.box{width:100%;height:1500px; background:#9F0;}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>

经过测试可以使用，不过没有测试所有的浏览器就试了ie