iframe透明自适应高度

解决iframe高度自适应与背景透明问题

原创于 2011-11-23 13:02:01 发布 · 145 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

综合专栏收录该内容

11 篇文章

订阅专栏

本文探讨了在web开发中使用iframe时遇到的两个常见问题：高度自适应和背景透明，并提供了相应的解决方案。通过设置iframe的样式属性，可以实现高度自适应和背景透明的效果。

最近有些web页面经常用到iframe，但是遇到两个很棘手的问题，一是高度自适应的问题，二是iframe出现空白页面，要如何让它背景透明？我设置了style="background-color:transparent;"但没有效果,以下是解决方法：

<iframe
id="iframepage" name="mainIFrame"
frameBorder=0  allowtransparency="true"
style="background-color:transparent;min-height:1000px;"
scrolling=no width="100%" onLoad="iFrameHeight()">
</iframe>

javascript:

<script type="text/javascript" language="javascript">
	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+72;
		}
	}
</script>