手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >javascript应用:Iframe自适应其加载的内容高度
javascript应用:Iframe自适应其加载的内容高度
摘要:main.htm:复制代码代码如下:iframe自适应加载的页面高度child.htm:iframe自适应其加载的网页(多浏览器兼容)fun...

main.htm:

复制代码 代码如下:

<html>

<head>

<metahttp-equiv='Content-Type'content='text/html;charset=gb2312'>

<metaname='author'content='F.R.Huang(meizz梅花雪)//www.meizz.com'>

<title>iframe自适应加载的页面高度</title>

</head>

<body>

<iframesrc="child.htm"></iframe>

</body>

</html>

child.htm:

<html>

<head>

<metahttp-equiv='Content-Type'content='text/html;charset=gb2312'>

<metaname='author'content='F.R.Huang(meizz梅花雪)//www.meizz.com'>

<title>iframe自适应其加载的网页(多浏览器兼容)</title>

<scriptlanguage=javascript>

functioniframeAutoFit()

{

try

{

if(window!=parent)

{

vara=parent.document.getElementsByTagName("IFRAME");

for(vari=0;i<a.length;i++)//author:meizz

{

if(a[i].contentWindow==window)

{

varh=document.body.scrollHeight;

if(document.all){h+=4;}

if(window.opera){h+=1;}

a[i].style.height=h;

}

}

}

}

catch(ex)

{

alert("脚本无法跨域操作!");

}

}

if(document.attachEvent)window.attachEvent("onload",iframeAutoFit);

elsewindow.addEventListener('load',iframeAutoFit,false);

</script>

</head>

<body>

<divstyle="width:200;height:400;background-color:yellow">

iframe自适应其加载的网页(多浏览器兼容)

</div>

</body>

</html>

【javascript应用:Iframe自适应其加载的内容高度】相关文章:

javascript常用的方法分享

JavaScript版代码高亮

javascript生成不重复的随机数

学习javascript文件加载优化

javascript实现Table排序的方法

理解Javascript图片预加载

Javascript高级应用:文件操作篇

javascript实现可全选、反选及删除表格的方法

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

Javascript生成全局唯一标识符(GUID,UUID)的方法

精品推荐
分类导航