iframe自适应内容高度,动态变高变低

开发系统经常用到左边菜单,右边iframe,的框架结构,如果iframe不随着子页面内容的高度随时变化就会出现双滚动条,非常难看。 看了别人的方法有些是可以,但是随着iframe的src 变化,有时高度不能变小,只能变大。于是自己写了一个,写得着急,目前只试了firefox 和ie8 ,如果大家发现问题,我们一起讨论。

var browserVersion = window.navigator.userAgent.toUpperCase();
var isOpera = false;
var isFireFox = false;
var isChrome = false;
var isSafari = false;
var isIE = false;
var iframeTime;
isOpera = browserVersion.indexOf("OPERA") > -1 ? true : false;
isFireFox = browserVersion.indexOf("FIREFOX") > -1 ? true : false;
isChrome = browserVersion.indexOf("CHROME") > -1 ? true : false;
isSafari = browserVersion.indexOf("SAFARI") > -1 ? true : false;
if (!!window.ActiveXObject || "ActiveXObject" in window)
	isIE = true;
function reinitIframe(){ 
	var iframe = document.getElementById("mainFrame"); 
	try{ 
		var height ;
		if(isIE)
			height = iframe.contentWindow.document.body.scrollHeight+4; 
		if(isFireFox)
			height = iframe.contentWindow.document.documentElement.scrollHeight; 
		iframe.height = height; 
	}catch (ex){} 
} 
window.setInterval("reinitIframe()", 200); 
<iframe src="iframe-inner200.html" frameborder="0"  id="mainFrame" height='100' style="padding: 0px; width: 50%;" > 

相关参考 http://www.cnblogs.com/slyzly/articles/2422737.html#commentform

http://wenku.baidu.com/link?url=6qjzmHXcS-_Eo7n21vScW7_bgrJBya6HSHZknXCADENEUKl83AAw8L0caHzj-UIBjsn-BG33wwkuJ8Gl9S_E191Gcd8ibSTn6wFprGDbcri

转载于:https://my.oschina.net/mefly/blog/613096

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值