您现在的位置:多问网知识中心电脑教学网页设计Iframe框架页高度自适应的方法(兼容IE和Firefox浏览器)

Iframe框架页高度自适应的方法(兼容IE和Firefox浏览器)

06-11 19:38:01   浏览次数:62126  栏目:网页设计
标签:网页设计教程,网页设计知识,http://www.duowen123.com Iframe框架页高度自适应的方法(兼容IE和Firefox浏览器),

    最近在做项目时用到了框架页,可是在网页中嵌入框架页时,框架页往往会出现滚动条,这对用户操作很不方便。一般情况下,嵌入的框架页面会出现纵向滚动条,那么我们能不能想办法让框架页的高度自适应呢?即根据页面的高度自动调整框架页的高度,而不出现纵向滚动条。在网上找了一些方法,但都只适用于IE浏览器,后来终于找到一种可以兼容IE和Firefox浏览器的了,拿来分享。

    其实用javascript代码就能实现,具体方法如下:

    1、将如下javascript代码嵌入到网页中:

<script type="text/javascript">
function SetCwinHeight(){
var iframeid=document.getElementById("htmer_iframe"); //框架页id
if (document.getElementById){
   if (iframeid && !window.opera){
   if (iframeid.contentDocument && iframeid.contentDocument.body.offsetHeight){
   iframeid.height = iframeid.contentDocument.body.offsetHeight;
   }else if(iframeid.Document && iframeid.Document.body.scrollHeight){
   iframeid.height = iframeid.Document.body.scrollHeight;
   }
   }
}
}
</script>

    2、在网页中调用iframe框架页代码:

<iframe width="100%" id="htmer_iframe" onload="Javascript:SetCwinHeight()" height="1" frameborder="0" src="htmer.php"></iframe>,Iframe框架页高度自适应的方法(兼容IE和Firefox浏览器)
相关热词搜索: tag: 网页设计,网页设计教程,网页设计知识,电脑教学 - 网页设计
上一篇:从微软官方网站免费下载Windows 7及序列号的方法
文章评论
联系我们 | 网站地图 | 范文大全 | 管理资料 | 驾照考试 | 教学资料 | 名言大全 | 软件下载
Copyright @ 多问网 all rights reserved
学生评语_教案设计_小学语文试卷
1 2 3 4 5 6 7 8 9 10 11 12