zoukankan
html css js c++ java
JavaScript实现Iframe自适应其加载的内容高度
在使用IFrame的时候经常出现内容高度不符影响页面整体效果,利用JavaScript可以实现Iframe自适应其加载的内容高度.
//main.htm:
<
html
>
<
head
>
<
meta
http-equiv
='Content-Type'
content
='text/html;
charset
=gb2312'
/>
<
meta
name
='author'
content
='F.R.Huang(meizz梅花雪)//www.meizz.com'
/>
<
title
>
iframe自适应加载的页面高度
</
title
>
</
head
>
<
body
>
<
iframe
src
="child.htm"
></
iframe
>
</
body
>
</
html
>
//child.htm:
<
html
>
<
head
>
<
meta
http-equiv
='Content-Type'
content
='text/html;
charset
=gb2312'
/>
<
meta
name
='author'
content
='F.R.Huang(meizz梅花雪)//www.meizz.com'
/>
<
title
>
iframe 自适应其加载的网页(多浏览器兼容)
</
title
>
<
script
type
="text/javascript"
>
<!--
function
iframeAutoFit()
{
var
ex;
try
{
if
(window
!=
parent)
{
var
a
=
parent.document.getElementsByTagName(
"
IFRAME
"
);
for
(
var
i
=
0
; i
<
a.length; i
++
)
//
author:meizz
{
if
(a[i].contentWindow
==
window)
{
var
h1
=
0
, h2
=
0
;
if
(document.documentElement
&&
document.documentElement.scrollHeight)
{
h1
=
document.documentElement.scrollHeight;
}
if
(document.body) h2
=
document.body.scrollHeight;
var
h
=
Math.max(h1, h2);
if
(document.all)
{h
+=
4
;}
if
(window.opera)
{h
+=
1
;}
a[i].style.height
=
h
+
"
px
"
;
}
}
}
}
catch
(ex)
{}
}
if
(document.attachEvent)
{
window.attachEvent(
"
onload
"
, iframeAutoFit);
window.attachEvent(
"
onresize
"
, iframeAutoFit);
}
else
{
window.addEventListener('load', iframeAutoFit,
false
);
window.addEventListener('resize', iframeAutoFit,
false
);
}
//
-->
</
script
>
</
head
>
<
body
>
<
table
border
="1"
width
="200"
style
="height: 400px; background-color: yellow"
>
<
tr
>
<
td
>
iframe 自适应其加载的网页(多浏览器兼容,支持XHTML)
</
td
>
</
tr
>
</
table
>
</
body
>
</
html
>
查看全文
相关阅读:
如何让aboboo 便携版在citrix下使用(aboboo在IPAD上使用)aboboo苹果版
旅游攻略:南京南京
[软件分享]aboboo英语复读机 使用心得
[计算机故障处理]EXCEL文件双击不能直接打开
[办公应用]如何制作二Y轴图(excel)
[办公应用]如何保护我的EXCEL表格结构,不被填表人员随意改动
[计算机故障]为什么我的手机SD卡一打开就是说“你的磁盘未格式化,现在需要格式化吗”?
[翻译角]Learn From George, Not Pinocchio(ESLPOD)
[项目机会]小区内的交通流量监控及展示
[计算机联网故障]WIFI接入正常,但是上网不正常(两种情况)
原文地址:https://www.cnblogs.com/zwei1121/p/900275.html
最新文章
Python程序打包为exe文件
python3操作注册表
VUE环境搭建
TortoiseSVN 和 VisualSVN Server 使用教程
Codeforces Round #590 (Div. 3) D. Distinct Characters Queries(线段树, 位运算)
Codeforces Round #590 (Div. 3) C. Pipes
Codeforces Round #590 (Div. 3) B2. Social Network (hard version)
Codeforces Round #590 (Div. 3) A. Equalize Prices Again
Acwing-287-积蓄程度(树上DP, 换根)
Acwing-286-选课(树上DP)
热门文章
洛谷-P3796-AC自动机加强版
洛谷-P3808-AC自动机(模板)
HDU-4763-Theme Section(KMP)
HDU-4847-Wow!Such Doge!(嘿嘿嘿, 水题)
the third assignment of software testing
the forth assignment of software testing
the second assignment of software testing
GitHub帮助文档翻译2——contribution
GitHub帮助文档翻译1——helloWorld
the first assignment of software testing
Copyright © 2011-2022 走看看