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. 简明python教程 --C++程序员的视角（二）:函数及作用域

    函数通过def关键字定义.def关键字后跟一个函数的标识符名称,然后跟一对圆括号.圆括号之中可以包括一些变量名,该行以冒号结尾.接下来是一块语句,它们是函数体. 函数的基本概念 1 位置:从左往右进行 ...

  2. 用Unity开发HTC VIVE——手柄控制篇

    写这篇文章的原因主要是因为现在虚拟现实非常的火爆但目前主流的虚拟现实设备(HTC VIVE)的教程却少的可怜,这个我深有体会.所以,我想将我平时开发中遇到的问题以及解决方法记录下来,分享给大家,若其中 ...

  3. Cannot use object of type yii\db\Connection as array

    $pointLog = $conn->createCommand('select * from table1 where is_deleted = 0 AND id1 = :id1 AND id ...

  4. 最长公共子序列（加强版） Hdu 1503 Advanced Fruits

    Advanced Fruits Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)T ...

  5. REPL LOG

    using System; using System.Collections.Generic; using System.Text; using System.Text.RegularExpressi ...

  6. 报表控件NCReport教程：集成NCReport到Qt应用程序中

    NCReport是一款轻量级.快速.多平台.简单易用的基于Qt toolkit的C++编写的报表解决方案,目前主要包括报表渲染库和报表设计器GUI应用程序. 但是好多使用NCReport控件的朋友都不 ...

  7. SpringMVC访问静态资源的三种方式(转)

    本文转自:http://www.iigrowing.cn/springmvc_fang_wen_jing_tai_zi_yuan_de_san_zhong_fang_shi.html 如何你的Disp ...

  8. url结构说明

    就以下面这个URL为例,介绍下普通URL的各部分组成 http://www.aspxfans.com:8080/news/index.asp?boardID=5&ID=24618&pa ...

  9. tp-link便携式路由器固件升级方式

    系统: win-7 32bit 关闭杀毒软件,关闭防火墙(保险起见) 各位从tp-link的官网下载自己对应的固件 http://www.tp-link.com.cn/product/list_por ...

  10. PLSQL Developer 不能连接 oracle 12c 64位 的解决办法 for win 64

    1.安装Oracle 12c 64位 2.安装32位的Oracle客户端( instantclient-basic-nt-12.1.0.1.0) 1) 下载instantclient-basic-nt ...