iframe自适应高度，Iframe显示不完整

iframe自适应高度，Iframe显示不完整，兼容IE、Chrome、火狐

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2014年8月13日 16:57:03 星期三

 

 

iframe在浏览器中不怎么好，高度问题或者说显示问题经常出现，而且在不同的浏览器表现方式各不相同，特别让人纠结。但可以通过js改变Iframe的高度。

 

js代码：

function setIframeHeight(iframeId){
	var cwin = document.getElementById(iframeId); 
	if (document.getElementById){
		if (cwin && !window.opera){
			if (cwin.contentDocument && cwin.contentDocument.body.offsetHeight){
				cwin.height = cwin.contentDocument.body.offsetHeight + 20; //FF NS 
			}
			else if(cwin.Document && cwin.Document.body.scrollHeight){
				cwin.height = cwin.Document.body.scrollHeight + 10;//IE 
			}
		}else{
			if(cwin.contentWindow.document && cwin.contentWindow.document.body.scrollHeight) 
			cwin.height = cwin.contentWindow.document.body.scrollHeight;//Opera 
		}
	} 
};

 

注意的是：

如果Iframe一开始就显示的话，可以在Iframe的onload事件直接加载方法，例：

<iframe onload="setIframeHeight(ifm1);" id="ifm1"  frameborder="0" scrolling="no" src="src" style="width: 100%;heigth: 100%;"></iframe>

 

若Iframe一开始是隐藏，如果显示后高度还有问题，就可以再次执行该方法setIframeHeight（id）。

document.getElementById("ifmDiv").style.display="block";
setIframeHeight("ifm1");

 

 

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2014年8月13日 16:57:03 星期三