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
>
查看全文
相关阅读:
sklearn各种分类器简单使用
使用Pandas加载数据
使用Sklearn-train_test_split 划分数据集
KNN_python
ga算法
粒子群算法
bp神经网络的实现C++
理解RNN
感知器的实现C++
线性神经网络的实现C++
原文地址:https://www.cnblogs.com/zwei1121/p/900275.html
最新文章
梯度下降法和牛顿法的联系
梯度下降 随机梯度下降 批量梯度下降
随机森林的简单理解
java中创建类的实例有几种方法
TensorFlow 最大池化
TensorFlow 卷积层
在linux系统中int、float、short、double各占多少个字节
随机梯度下降法SGD
tensorFlow的linux基本操作笔记
Numpy_构建列向量
热门文章
puthon的random,概率和随机选择
强化学习之博弈论——笔记
马尔科夫模型(Markov)(MDP)
Keras mlp 手写数字识别示例
Keras文本预处理
HDU4528 小明捉迷藏 [搜索-BFS]
HDU1172猜数字 [模拟]
Pandas处理缺失数据
from __future__ import print_function的使用
win10安装Keras报错处理
Copyright © 2011-2022 走看看