手机
当前位置:查字典教程网 >编程开发 >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中createElement的两种创建方式

javascript实现简单的进度条

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

javascript实现炫酷的拖动分页

javascript相关事件的几个概念

JavaScript实际应用:innerHTMl和确认提示的使用

JavaScript中使用自然对数ln的方法

javascript实现table表格隔行变色的方法

javascript常用的方法分享

精品推荐
分类导航