框架页自动适应高度

fayxue 2009-04-07 11:22:18



<!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>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>认证天下</title>

<link href="style.css" rel="stylesheet" type="text/css" /></head>

<frameset rows="140,30,*,50" frameborder="no" border="0" framespacing="0">

  <frame src="top.htm" name="top" scrolling="No" noresize="noresize" id="topFrame" />

  <frame src="xindaohang.htm" name="menu" scrolling="No" noresize="noresize" id="menu" />

  <frame src="center.htm" name="main" id="main" scrolling="No"/>

  <frame src="bottom.htm" name="bottom" scrolling="No" noresize="noresize" id="bottom" />

</frameset><noframes></noframes>

<body>



</body>

</html>

因为我main框架嵌套的页面高度是不一样的，加上滚动条太难看了，想让框架页能根据所嵌套的网页的高度来调整框架页frame 的高度，在网上找了一句但不会用，请高手指教 onload="parent.document.all.iframeID.style.height=document.body.scrollHeight" 这句是写在所要嵌套的网页 body 里的，怎么改？

...全文

395 10 打赏收藏转发到动态举报

写回复

用AI写文章

10 条回复

切换为时间正序

请发表友善的回复…

发表回复

claymore1114 2009-04-15

打赏
举报

window.onload=window.onresize=function(){parent.document.all.main.style.height=document.body.scrollHeight

}

lzf1988119 2009-04-15

打赏
举报

用js动态调整框架大小
我以前就是这么干的

tengjian1981 2009-04-15

打赏
举报

将下面代码嵌到子页面里就可以了，注意的一点是样式表中不要用window.onload事件，不然会冲突。

function changeIframeHeight() //自动改变 Iframe 的高度
{
if(top != self)
{
window.parent.document.getElementById("main").style.height = document.body.scrollHeight + 50;
if((document.body.scrollHeight + 3) < 475) window.parent.document.getElementById("main").style.height = 475;
}
}
window.onload = changeIframeHeight;
window.onresize = changeIframeHeight;

fayxue 2009-04-15

打赏
举报

回四楼，这是写在被包含页面里的，不是框架页

pdsnet 2009-04-15

打赏
举报





<script type="text/javascript">

 var iframeids=["center"] //框架名



 var iframehide="yes"



 function dyniframesize() 

 {

  var dyniframe=new Array();

  

  for (i=0; i<iframeids.length; i++)

  {

   if (document.getElementById)

   {

   

    dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);

    if (dyniframe[i] && !window.opera)

    {

     dyniframe[i].style.display="block"

     if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight) 

      dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight; 

     else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) 

      dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;

    }

    

   }

  

   if ((document.all || document.getElementById) && iframehide=="no")

   {

    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])

    tempobj.style.display="block"

   }

  }

 }



 if (window.addEventListener)

 window.addEventListener("load", dyniframesize, false)

 else if (window.attachEvent)

 window.attachEvent("onload", dyniframesize)

 else

 window.onload=dyniframesize

</script>

itcrazyman 2009-04-08

打赏
举报

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>认证天下</title>
<link href="style.css" rel="stylesheet" type="text/css" /></head>
<frameset rows="140,30,*,50" frameborder="no" border="0" framespacing="0">
<frame src="top.htm" name="top" scrolling="No" noresize="noresize" id="topFrame" />
<frame src="xindaohang.htm" name="menu" scrolling="No" noresize="noresize" id="menu" />
<frame src="center.htm" name="main" id="main" scrolling="No"/>
<frame src="bottom.htm" name="bottom" scrolling="No" noresize="noresize" id="bottom" />
</frameset><noframes></noframes>
<body onload="parent.document.all.iframeID.style.height=document.body.scrollHeight" >

</body>
</html>
你浏览器的版本?我这边不报错

fayxue 2009-04-08

打赏
举报

onload="parent.document.all.main.style.height=document.body.scrollHeight"浏览器报错
“拒绝访问”为什么？？怎么改呀，急死我了

大猫钓鱼 2009-04-08

打赏
举报

window.onload = function(){
...
}

或者
<body onload="...">
...
</body>

takako_mu 2009-04-08

打赏
举报

沒這樣寫過，不過我是JS中寫死也是可以的



function pageLoad(sender,args)

{

    if(!args._isPartialLoad)

    {

       resize();

    }

}



function resize()

{

            try{

            var myTable=$get("__gvctl00_ContentPlaceHolder1_GridView1__div");

            var objSiteMapPathTable=$get("SiteMapPathTable");

            var myHeadr=$get("ctl00_ContentPlaceHolder1_panTitle");

            var myDetail=$get("ctl00_ContentPlaceHolder1_panContent");

            var obj_PageControlBarHeader=$get("PageControlBarHeader")

            var obj_PageControlBarFoot=$get("PageControlBarFoot")

           

            var height1=objSiteMapPathTable.scrollHeight;

            var height2=myHeadr.scrollHeight;

            var height3=myDetail.scrollHeight;

            var height4=obj_PageControlBarHeader.scrollHeight;

            var height5=obj_PageControlBarFoot.scrollHeight;



             if( $find("cpbMenu")._collapsed)

             {

                 myTable.style.height=screen.availHeight-height1-height2-height3-height4-height5-window.screenTop-10;

             }

             else

             {

                 myTable.style.height=screen.availHeight-height1-height2-height3-height4-height5-window.screenTop-100;

             }

 

            myTable.style.width=screen.width-250;

            myHeadr.style.width=screen.width-250;

            myDetail.style.width=screen.width-250;

            $get("PageControlBarHeader").style.width=screen.width-250;

            $get("PageControlBarFoot").style.width=screen.width-250;

  

        var obj_Left=$get("ctl00_Panel2")



        obj_Left.style.height=screen.availHeight-window.screenTop-100;

        }

        catch(e)

        {

        

        }



}