同域时Iframe高度自适应
调用:
代码
<script type="text/javascript">
function SetWinHeight(obj)
{
var win=obj;
if (document.getElementById)
{
if (win && !window.opera)
{
if (win.contentDocument && win.contentDocument.body.offsetHeight)
win.style.height = win.contentDocument.body.offsetHeight;
else if(win.Document && win.Document.body.scrollHeight)
win.style.height = win.Document.body.scrollHeight;
}
}
}
</script>
function SetWinHeight(obj)
{
var win=obj;
if (document.getElementById)
{
if (win && !window.opera)
{
if (win.contentDocument && win.contentDocument.body.offsetHeight)
win.style.height = win.contentDocument.body.offsetHeight;
else if(win.Document && win.Document.body.scrollHeight)
win.style.height = win.Document.body.scrollHeight;
}
}
}
</script>
调用:
<iframe width="100%" frameborder="0" id="ifr" name="ifr" src="mindex.html" onload="SetWinHeight(this)" scrolling="no"></iframe>
跨域时Iframe高度自适应
A页面：
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function autoHeightIFrameNavigate(iframeId,url)
{
var iframe = $('#' + iframeId);
iframe.attr('_name_',iframe.attr('name')) //备份原 name
.attr('src',url) //设置URL
.one('load',function ()
{
this.contentWindow.location = "about:blank"; //向代理页面，直接使这个
$(this).one('load',function ()
{
var msg = this.contentWindow.name; //得值 这个值就度
this.contentWindow.name = $(this).attr('_name_'); //恢复原 Name
this.contentWindow.location = url; //再次向目标页面
try
{
var height = eval(msg); //得并设置度
iframe.css('height', height + 'px');
}
catch(e)
{
alert('目标页面没有设置度 window.name')
}
})
});
}
function window.onload()
{
autoHeightIFrameNavigate('ifr', "http://www.baidu.com");
}
</script>
</head>
<body>
<iframe id="ifr" width="100%" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"></iframe>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function autoHeightIFrameNavigate(iframeId,url)
{
var iframe = $('#' + iframeId);
iframe.attr('_name_',iframe.attr('name')) //备份原 name
.attr('src',url) //设置URL
.one('load',function ()
{
this.contentWindow.location = "about:blank"; //向代理页面，直接使这个
$(this).one('load',function ()
{
var msg = this.contentWindow.name; //得值 这个值就度
this.contentWindow.name = $(this).attr('_name_'); //恢复原 Name
this.contentWindow.location = url; //再次向目标页面
try
{
var height = eval(msg); //得并设置度
iframe.css('height', height + 'px');
}
catch(e)
{
alert('目标页面没有设置度 window.name')
}
})
});
}
function window.onload()
{
autoHeightIFrameNavigate('ifr', "http://www.baidu.com");
}
</script>
</head>
<body>
<iframe id="ifr" width="100%" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"></iframe>
</body>
</html>
B页面：
<script type="text/javascript">
function window.onload()
{
window.name = document.body.scrollHeight;
}
</script>
function window.onload()
{
window.name = document.body.scrollHeight;
}
</script>
要让iframe全屏显示,在body里面加上leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0"
<body leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0">
