iframe框架的自适应

最新推荐文章于 2024-08-28 14:23:26 发布

雷诺妍

最新推荐文章于 2024-08-28 14:23:26 发布

阅读量603

点赞数

CC 4.0 BY-SA版权

分类专栏： HTML5

本文链接：https://blog.youkuaiyun.com/PrairieLoneWolf/article/details/8571255

HTML5 专栏收录该内容

6 篇文章

订阅专栏

近期由于项目的用到iframe在写自适应时发现在chrome中不行，经过多方查找终于解决了特此记下一坐备忘
其中js代码如下

	function reinitIframe(){
		var iframe = document.getElementById("mainframe");	//获得iframe
		try{
			var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;	//获得iframe内文档的滚动条的高度
			var bHeight = iframe.contentWindow.document.body.scrollHeight;		//获得iframe中body的滚动条的高度
			var height = Math.max(bHeight, dHeight);	//取其中的最大值
			iframe.height =  height;
		}catch (ex){}
	}
	window.setInterval("reinitIframe()", 200);	//通过自动调用动态改变iframe的高度，解决了iframe一旦变大不会变小的问题

其中 chrome 浏览器把他当成跨域的iframe，因此必须用http访问才能解决问题