小二哥's blog

----zhangzs8896(小二)

导航

iframe自适应问题

Posted on 2006-07-29 19:15  小二哥  阅读(393)  评论(0编辑  收藏  举报

有时候会在页面里使用框架,但又不想叫它出现滚动条,这就用到了自适应。
架设default.aspx页面里使用了Iframe,它的ID: iframe1,src指向a.aspx

<IFRAME id="iframe1" name="iframe1" marginWidth="0" marginHeight="0" frameBorder="0" scrolling="no" src="a.aspx"
runat
="server"></IFRAME>

那么在default里使用如下脚本:

function dyniframesize(iframename) 
{
    
var pTar = null;
    
if (document.getElementById)
    
{
        pTar 
= document.getElementById(iframename);
    }

    
else{
        eval('pTar 
= ' + iframename + ';');
    }

    
if (pTar && !window.opera)
    
{
        pTar.style.display
="block"
        
if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight)
        
{
            pTar.height 
= pTar.contentDocument.body.offsetHeight+10
        }

        
else if (pTar.Document && pTar.Document.body.scrollHeight)
        
{
            pTar.width 
= pTar.Document.body.scrollWidth;
            pTar.height 
= pTar.Document.body.scrollHeight;
            
        }

    }

}

在body里增加:
onload="dyniframesize('iframe1')"

即可达到当我们打开default.aspx,使得a.aspx自适应大小。
还存在一个问题,当点击a.aspx里的按钮时,需要重新计算他的父页面中的iframe的大小,达到
刷新a.aspx时,页面依然自适应。
function dyniframesize() 
{
    
var pTar = null;
    
if (document.getElementById)
    
{
//仅仅修改此句代码:        
pTar = window.parent.document.getElementById("iframe1");
    }

    
else{
        eval('pTar 
= ' + iframename + ';');
    }

    
if (pTar && !window.opera)
    
{
        pTar.style.display
="block"
        
if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight)
        
{
            pTar.height 
= pTar.contentDocument.body.offsetHeight+10
        }

        
else if (pTar.Document && pTar.Document.body.scrollHeight)
        
{
            pTar.width 
= pTar.Document.body.scrollWidth;
            pTar.height 
= pTar.Document.body.scrollHeight;
            
        }

    }

}

同样在a.aspx的body里加载这个函数。
onload="dyniframesize()"