ifram高度自适应，两种方法

方法一：父页面获取子页面高度，改变父页面高度
以下代码加到父页面

<script language="javascript">

//获取iframe子页面的方法，需调用才能实现 (<body onload="doShow()">)

function doShow(){

//获得子页面的高度  document.getElementById("content").contentWindow.document.body.scrollHeight

document.getElementById("content").style.height = document.getElementById("content").contentWindow.document.body.scrollHeight + "px";

//改变iframe的高度

}

</script>
方法二：子页面直接改变父页面高度

以下代码加到子页面

<script language="javascript">

//控制父页面iframe高度的方法

parent.document.getElementById("content").style.height = document.body.scrollHeight +"px";

</script>
 

iframe自适应方法的更多相关文章

  1. Iframe 自适应高度的方法！

    第一种方法:代码简单,兼容性还可以,大家可以先测试下. function SetWinHeight(obj) { var win=obj; if (document.getElementById) { ...

  2. iframe自适应高度的多种方法小结

    转自:http://www.jb51.net/article/15780.htm 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的大小 ...

  3. iframe自适应高度的多种方法方法小结

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的  不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 ifram ...

  4. iframe自适应高度的多种方法方法小结（转）

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的 ...

  5. 【前端开发】前端引入公共部分footer header的几种方法，及iframe自适应高度js

    一.引入页面几种方法   1.IFrame引入,看看下面的代码    <iframe   frameborder=0   border=0   width=300   height=300    ...

  6. iframe高度自适应方法

    <iframe width="100%" id="tbbrecommend" name="tbbrecommend" src=&quo ...

  7. 真正的让iframe自适应高度 兼容多种浏览器随着窗口大小改变

    今天有朋友问到我关于"iframe自适应高度"的问题,原本以为是很简单的问题,没想到折腾了20分钟才搞定.期间遇到几个问题,要么是高度自适应了,但是当窗口改变时会出现滚动条.也就是 ...

  8. jquery iframe自适应高度[转]

      经典代码 iFrame 自适应高度,在IE6/IE7/IE8/Firefox/Opera/Chrome/Safari通过测试. 很古老的方法: <iframe src="../In ...

  9. js实现iframe自适应高度

    转自:http://www.jb51.net/article/15780.htm 对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的! 不带边框的iframe因为能 ...

随机推荐

  1. 公有IP与私有IP

    在 IPv4 里面就只有两种 IP 的类别,分别是: Public IP : 公共 IP ,经由 INTERNIC 所统一规划的 IP,有这种 IP 才可以连上 Internet : Private ...

  2. Maps for Developers

    苹果官方文档: Give your apps a sense of place with maps and location information. Present maps with custom ...

  3. Web Components是不是Web的未来

    今天 ,Web 组件已经从本质上改变了HTML.初次接触时,它看起来像一个全新的技术.Web组件最初的目的是使开发人员拥有扩展浏览器标签的能力,可以自由的进行定制组件.面对新的技术,你可能会觉得无从下 ...

  4. :radio :checkbox

    匹配所有单选按钮   示例 描述: 查找所有单选按钮 HTML 代码: <form> <input type="text" /> <input typ ...

  5. php Windows系统 wamp集成环境下redis的使用

    先说一下我的本地环境,使用的是wamp集成环境,(Apache 2.4.9.PHP 5.5.12.MySQL 5.6.17) windows下安装PHP扩展: 第一步:找到扩展文件(.dll),htt ...

  6. Eclipse默认标签TODO,XXX,FIXME和自定义标签[转]

    http://www.blogjava.net/Guides/archive/2011/11/14/363686.html   Eclipse中的一些特殊的注释技术包括:    1.    // TO ...

  7. asp.net core 通过 TeamCity 实现持续集成笔记

    0x00 很早之前就想体验一把持续集成的快感,然后刚好手头上有个 asp.net core 的项目,就想来部署一下持续集成.一开始我是想用 Jenkins 的,弄了好半天,git 仓库没法同步下来,我 ...

  8. EF生成实体模板改良

    也许介绍的方法并不是完美的解决方法 web工程里添加这两项 里面会生成两个模板文件 上下文模板和实体类模板,现在主要对实体类模板进行改良 1.讲using 放在文件头 <#=codeString ...

  9. [问题2014S02] 解答

    [问题2014S02] 解答  首先注意到: 两个实系数多项式 \(f(x),g(x)\) 互素当且仅当 \(f(x),g(x)\) 在复数域 \(\mathbb{C}\) 上没有共公根, 当且仅当结 ...

  10. ArcgisAdd-In开发入门实例

    1.开发环境 Vs2012+Arcgis10.2+win7 64bit 2.实现代码 首先在VS2012中新建一个解决方案,命名AddInTest. 接着,给解决方案AddInTest新建一个项目: ...