首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

iframe自动调节大小疑点-救命

2012-03-14 
iframe自动调节大小问题--救命!我页面中iframe的src可以选择的,但是由于每次选择的src页面的大小不确定,所

iframe自动调节大小问题--救命!
我页面中iframe的src可以选择的,但是由于每次选择的src页面的大小不确定,所以要不断地改变iframe的大小,并且我不愿意用滚动栏,我已经把iframe的滚动栏设为none了。
能不能写段代码让iframe根据所容纳页面的大小自动设置高度呢?
很急,救命!!!!!!!!!!

[解决办法]
主页面:
先 <iframe id= "frameName " src= 'aaa.htm '> </iframe>

内嵌页:aaa.htm

<body onload= "parent.document.getElementById( 'frameName ').height=document.body.scrollHeight; ">
[解决办法]
每查询出一次结果,加上这句
document.getElementById( 'frameName ').height=document.getElementById( 'frameName ').scrollHeight;
[解决办法]
<script language= "Javascript ">
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf( "Firefox ")).split( "/ ")[1];
//extra height in px to add to iframe in FireFox 1.0+ browsers
var FFextraHeight=getFFVersion> =0.1? 16 : 0 ;

function dyniframesize(iframename)
{
var pTar = null;
if (document.getElementById)
{
pTar = document.getElementById(iframename);
}
else
{
eval( 'pTar = ' + iframename + '; ');
}
if (pTar && !window.opera)
{
//begin resizing iframe
pTar.style.display= "block ";

if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight)
{
//ns6 syntax
pTar.height = pTar.contentDocument.body.offsetHeight+FFextraHeight;
}
else if (pTar.Document && pTar.Document.body.scrollHeight)
{
//ie5+ syntax
pTar.height = pTar.Document.body.scrollHeight;
}
}
}


</script>

<iframe id= "contentframe " border= "0 " name= "content " frameSpacing= "0 " src= "aaa.html "
scrolling= "no " onload= "javascript:{dyniframesize( 'contentframe ');} " height= "100% "
allowTransparency> </iframe>
[解决办法]
<html>
<head>
<meta http-equiv= 'Content-Type ' content= 'text/html; charset=gb2312 ' />
<title> iframe自适应加载的页面高度 </title>
</head>

<body>
<div> <iframe src= "child.htm "> </iframe> </div>
</body>
</html>

child.htm:

<html>
<head>
<meta http-equiv= 'Content-Type ' content= 'text/html; charset=gb2312 ' />
<title> iframe 自适应其加载的网页(多浏览器兼容) </title>
<script type= "text/javascript ">
<!--
function iframeAutoFit()
{
try
{
if(window!=parent)
{
var a = parent.document.getElementsByTagName( "IFRAME ");
for(var i=0; i <a.length; i++)
{
if(a[i].contentWindow==window)
{
var h1=0, h2=0;
a[i].parentNode.style.height = a[i].offsetHeight + "px ";
a[i].style.height = "10px ";
if(document.documentElement&&document.documentElement.scrollHeight)


{
h1=document.documentElement.scrollHeight;
}
if(document.body) h2=document.body.scrollHeight;

var h=Math.max(h1, h2);
if(document.all) {h += 4;}
if(window.opera) {h += 1;}
a[i].style.height = a[i].parentNode.style.height = h + "px ";
}
}
}
}
catch (ex){}
}
if(window.attachEvent)
{
window.attachEvent( "onload ", iframeAutoFit);
//window.attachEvent( "onresize ", iframeAutoFit);
}
else if(window.addEventListener)
{
window.addEventListener( 'load ', iframeAutoFit, false);
//window.addEventListener( 'resize ', iframeAutoFit, false);
}
//-->
</script>
</head>
<body>
<table border= "1 " width= "200 " style= "height: 400px; background-color: yellow ">
<tr>
<td> iframe 自适应其加载的网页(多浏览器兼容,支持XHTML) </td>
</tr>
</table>
</body>
</html>

热点排行