手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >如何实现iframe(嵌入式帧)的自适应高度
如何实现iframe(嵌入式帧)的自适应高度
摘要:好几次看到有人提问问到如何实现iframe的自适应高度,能够随着页面的长度自动的适应以免除页面和iframe同时出现滚动条的现象,刚好我在工...

好几次看到有人提问问到如何实现iframe的自适应高度,能够随着页面的长度自动的适应以免除页面和iframe同时出现滚动条的现象,刚好我在工作中也碰到了类似问题,于是上网翻查,东抄抄西看看,弄出来这么一个函数,贴到页面里面就能用了。不敢独享,大家要是觉得有用,欢迎使用

源代码如下

复制代码 代码如下:

<scripttype="text/javascript">

//**iframe自动适应页面**//

//输入你希望根据页面高度自动调整高度的iframe的名称的列表

//用逗号把每个iframe的ID分隔.例如:["myframe1","myframe2"],可以只有一个窗体,则不用逗号。

//定义iframe的ID

variframeids=["test"]

//如果用户的浏览器不支持iframe是否将iframe隐藏yes表示隐藏,no表示不隐藏

variframehide="yes"

functiondyniframesize()

{

vardyniframe=newArray()

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

{

if(document.getElementById)

{

//自动调整iframe高度

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)//如果用户的浏览器是NetScape

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

elseif(dyniframe[i].Document&&dyniframe[i].Document.body.scrollHeight)//如果用户的浏览器是IE

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

}

}

//根据设定的参数来处理不支持iframe的浏览器的显示问题

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

{

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

tempobj.style.display="block"

}

}

}

if(window.addEventListener)

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

elseif(window.attachEvent)

window.attachEvent("onload",dyniframesize)

else

window.onload=dyniframesize

</script>

使用的时候只要贴在<head></head>里面就可以了

【如何实现iframe(嵌入式帧)的自适应高度】相关文章:

Javascript实现每日自动换一张图片的方法

JavaScript中this关键字使用方法详解

javascript先序遍历DOM树的方法

JavaScript中Number.MIN_VALUE属性的使用示例

如何遍历对象的属性?

JQuery实现带排序功能的权限选择实例

多个iframe自动调整大小的问题

javascript实现简单的省市区三级联动

javascript实现youku的视频代码自适应宽度

javascript实现table选中的行以指定颜色高亮显示

精品推荐
分类导航