兼容IE6, Firefox, Safari, Opera.
只支持同域的iFrame,不支持跨域
方法一: 使用jquery插件:
From: http://www.lost-in-code.com/programming/jquery-auto-iframe-height/
http://www.lost-in-code.com/wp-content/projects/auto-iframe-height/jquery.autoheight.js
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Auto iFrame Height</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.autoheight.js"></script>
</head>
<body>
<div align="center">
<h1>Auto iFrame Height</h1>
<iframe class="autoHeight" width="100%" frameborder="0" scrolling="no" src="2col.html"></iframe>
</div>
</body>
</html>
方法二:
From: http://www.javaeye.com/topic/839143
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>iFrame auto height</title>
<script src="js/jquery.js"></script>
<script type="text/javascript">
function heightSet(frameId, frameName){
// FF和IE必须要通过iframe的名字去得到内部页面高度,而其他浏览器则可以用this或ID
if($.browser.mozilla || $.browser.msie) {
bodyHeight =window.frames[frameName].document.body.scrollHeight;
}else{
bodyHeight = document.getElementById(frameId).contentWindow.document.documentElement.scrollHeight;
}
document.getElementById(frameId).height = bodyHeight;
}
</script>
</head>
<body>
<iframe id="mainFrame" name="mainFrame" frameborder="0" scrolling="no" src="2col.html" onload="heightSet('mainFrame', 'mainFrame')"></iframe>
</body>
</html>