iframe高度自适应
iframe高度自适应(兼容IE,FF,Opera)
function SetCwinHeight(obj)
{
varcwin=obj;
if(document.getElementById)
{
if(cwin&&!window.opera)
{
if(cwin.contentDocument&&cwin.contentDocument.body.offsetHeight)
cwin.height=cwin.contentDocument.body.offsetHeight+20;
elseif(cwin.Document&&cwin.Document.body.scrollHeight)
cwin.height=cwin.Document.body.scrollHeight+10;
}
}
}然后……
进入了测试过程(调用很简单，先略过)
1.IE---通过但是高度还是有稍微的差距，很小，滚动条还在
2.FF---通过与IE一样，有小差距
3.Opera --- 看那个JS的条件就知道，通不过的但主流浏览器至少要通过这三项撒！！！
于是，各浏览器在处理document.scrollHeight或者offsetHeigth时的特殊现象发现
Opera浏览器在处理iframe内容的时候，用的是contentWindow 而处理内容高度的时候，却与IE一致从而，有了下面这段js
<html>
<head>
<script>
functionSetCwinHeight(obj)
{
varcwin=obj;
if(document.getElementById)
{
if(cwin&&!window.opera)
{
if(cwin.contentDocument&&cwin.contentDocument.body.offsetHeight)
cwin.height=cwin.contentDocument.body.offsetHeight+20;//FFNS
elseif(cwin.Document&&cwin.Document.body.scrollHeight)
cwin.height=cwin.Document.body.scrollHeight+10;//IE
}
else
{
if(cwin.contentWindow.document&&cwin.contentWindow.document.body.scrollHeight)
cwin.height=cwin.contentWindow.document.body.scrollHeight;//Opera
}
}
}
</script>
</head>
<body>
<iframesrc="20103622440.html"onload="SetCwinHeight(this);"width="600px">
</body>
</html>这样一来，总算把这三个浏览器给适应了，做为程序员，还是要细心点
再测试一下
OK...3个浏览器均正常显示，也无iframe的纵向滚动条了