javascript 装载iframe的子页面自适应高度

假设主页面有一个div,里面放置一个iframe:
<div id="frameBox">
<iframe id="frameWin" src="1.html" name="opWin" style="width:100%;height:100%" frameborder="0" scrolling="no"></iframe>
</div>

  3个菜单链接,分别在iframe加载1.html、2.html、3.html三个页面。3个子页面分别在自己页面加载完window.onload执行:
function aa(){ 
       var newHeight = document.body.scrollHeight + 20 + "px";      
       window.parent.document.getElementById("frameBox").style.height = newHeight;
       //以上firefox通过,但是ie6必须加上下面这句,不然iframe高度是改了,但是可见区域没有改
       window.parent.document.getElementById("frameWin").style.height = newHeight;
}

javascript教程 装载iframe的子页面自适应高度

时间: 2024-08-29 22:11:48

javascript 装载iframe的子页面自适应高度的相关文章

利用JS实现iframe 子页面自适应高度

ie6.firefox2 通过, 假设主页面有一个div,里面放置一个iframe<div id="frameBox"><iframe id="frameWin" src="1.html" name="opWin" style="width:100%; height:100% " frameborder="0"  scrolling="no">

JavaScript实现iframe框架子页面刷新代码

框架的刷新以前总是搞不定,现在想起这问题,解决方法还真不少,这里总结了7种用JS刷新框架的方法,在任意一个子框架页中刷新其它框架页,还是比较实用的,这7种方法是: 方法1. window.parent.frames[1].location.reload(); 方法2. window.parent.frames.bottom.location.reload(); 方法3. window.parent.frames["bottom"].location.reload(); 方法4. win

Iframe实现跨浏览器自适应高度解决方法_jquery

本文以实例形式讲述了Iframe实现跨浏览器自适应高度解决方法,非常具有实用价值.分享给大家供大家参考之用.具体方法如下: 该方法使用了jQuery,因此需要在iframe的src页面里面引入jQuery. 父页面里面相对简单一点,主要包含以下代码: <iframe id="if1" scrolling="no" src="2.html"></iframe> 在iframe的src页面里面代码如下: <script

js中iframe框架子页面中调用父窗口函数

分两种情况: 第一种:在iframe子页面调用父页面js函数: 子页面调用父页面函数只需要写上window.praent就可以了.比如调用a()函数,可以写成:  代码如下 复制代码 window.praent.a(); a()为方法: 第二种:在iframe子父页面调用子页面js函数: 这个要稍微复杂些,我们可以用:  代码如下 复制代码 document.getElementById('ifrtest').contentWindow.b(); 注:ifrtest是iframe框架的id,b(

javascript关于open.window子页面执行完成后刷新父页面的问题分析

  这篇文章主要介绍了javascript关于open.window子页面执行完成后刷新父页面的问题,实例分析了javascript操作子页面的执行与父页面的刷新技巧,非常具有实用价值,需要的朋友可以参考下 本文实例分析了javascript关于open.window子页面执行完成后刷新父页面的方法.分享给大家供大家参考.具体分析如下: 主页面: ? 1 <input id="btnAdd" type="button" onclick="openWi

JS解决iframe之间通信和自适应高度的问题_javascript技巧

首先说明下,iframe通信 分为:同域通信 和 跨域通信. 一. 同域通信 所谓同域通信是指 http://localhost/demo/iframe/iframeA.html 下的a.html页面嵌套 iframe 比如: <iframe src="http://localhost/demo/iframe/iframeB.html" id="iframeA" name="iframeA">的B.html页面,这两个页面数据进行通信

如何实现iframe(嵌入式帧)的自适应高度

自适应 好几次看到有人提问问到如何实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象,刚好我在工作中也碰到了类似问题,于是上网翻查,东抄抄西看看,弄出来这么一个函数,贴到页面里面就能用了.不敢独享,大家要是觉得有用,欢迎使用源代码如下 <script type="text/javascript"> //** iframe自动适应页面 **//  //输入你希望根据页面高度自动调整高度的iframe的名称的列表 //

如何实现iframe(嵌入式帧)的自适应高度_javascript技巧

好几次看到有人提问问到如何实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象,刚好我在工作中也碰到了类似问题,于是上网翻查,东抄抄西看看,弄出来这么一个函数,贴到页面里面就能用了.不敢独享,大家要是觉得有用,欢迎使用 源代码如下 复制代码 代码如下: <script type="text/javascript">  //** iframe自动适应页面 **//  //输入你希望根据页面高度自动调整高度的iframe

Iframe 自动适应页面的高度示例代码

 这篇文章主要介绍了Iframe如何自动适应页面的高度,需要的朋友可以参考下    代码如下: function SetCwinHeight(obj) {  var cwin = obj;  if (document.getElementById) {  if (cwin && !window.opera) {  if (cwin.contentDocument && cwin.contentDocument.body.offsetHeight)  cwin.height