iframe 这个东西功能是很强大，但是有一个巨大的问题就是高度自适应的问题；

不过这个问题，百度或者谷歌上有很多解决办法，但是，很多时候都有兼容性问题； 所有我就每个方法都试了一遍，终于找到了一个

感觉很牛的样子，不需要用到js 就可以让iframe 里的内容覆盖整个页面，感觉很舒服。哈哈哈

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

<style type="text/css">

    body {margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;overflow: hidden;}

</style>

    <body>

        <div>

            <iframe id="external-frame" src="https://cdn-huoshu.fire2333.com/landpages/rxgl/template/4039/index.php?pt=7590&footer_id=1" width="100%" height="100%" scrolling=" no"></iframe>

        </div>

    </body>

</html>

这样，就可以完美的解决这个问题啦；

有三点要注意哦：

第一：一定要已html开头，而不是用<!DOCTYPE html>开头

第二：body的overflow:hidden ; 一定不要忘记加；

第三：iframe 的高度100%一定要记得加上。这样就解决了我的问题了；

虽然不知道这种实现的原理是什么，希望有知道的朋友可以告诉我下。

这在跨域的时候，是真的好用，尤其是不能修改iframe 里的页面的时候；

同域的话：

有一段js代码就可以解决这个问题啦；

function setIframeHeight(iframe) {

if (iframe) {

var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;

if (iframeWin.document.body) {

iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight;

}

}

};

window.onload = function () {

setIframeHeight(document.getElementById('external-frame'));

};

在页面里插入这个就好啦；

我觉得这两个方法完美的解决了我公司一些php们的问题。

天天都在用iframe结果用的还那么不清楚，实在搞不懂。

尤其是某个php，什么css js html都不会，真心不知道他是怎么成为php的。连获取元素都不会。很气

瞎抱怨下，反正没人看。哈哈哈哈，总之这两种方法我觉得很好。赞；

iframe 里的高度适应的问题的更多相关文章

  1. iframe 里的高度自适应

    由于公司里的很多东西都要用到iframe 导致我不得不各种百度 首先是自适应高度 // document.domain = "caibaojian.com"; function s ...

  2. 获取Iframe页面高度并赋值给Iframe以及获取iframe里的元素

    最近接手了别人的项目,别人用到了iframe,自己在实战中总结了一些关于iframe的小问题. 获取Iframe页面高度并赋值给Iframe Html <iframe name="co ...

  3. 原生JS操作iframe里的dom

    转:http://www.css88.com/archives/2343 一.父级窗口操作iframe里的dom JS操作iframe里的dom可是使用contentWindow属性,contentW ...

  4. iframe里访问父级里的方法属性

    window.parent.attributeName;  // 访问属性attributeName是在父级窗口的属性名 window.parent.Func();  // 访问属性Func()是在父 ...

  5. JS操作未跨域iframe里的DOM

    这里简单说明两个方法,都是未跨域情况下在index.html内操作b.html内的 DOM. 如:index.html内引入iframe,在index内如何用JS操作iframe内的DOM元素? 先贴 ...

  6. 自动适应iframe右边的高度

    在开发项目过程中,用iframe嵌套,会发现一个问题,用iframe嵌套的html结构右边不会自动适应高度. 这时候找到了一个解决方法: <iframe name="my_iframe ...

  7. js获取iframe里的body内容

    做个页面 需要加入a.html 使用的js动态添加iframe 直接JQ添加的 代码 $(".banner-box").after(“<iframe src="ht ...

  8. 用jQuery在IFRAME里取得父窗口的某个元素的值

    收集网上的一些示例: 用jQuery在IFRAME里取得父窗口的某个元素的值 只好用DOM方法与jquery方法结合的方式实现了 1.在父窗口中操作 选中IFRAME中的所有单选钮 $(window. ...

  9. jQuery实现iframe的自适应高度

    假设我们在当前页面要嵌套一个iframe 1 <iframe id="myframe" src="test.html" height="240& ...

随机推荐

  1. 【Python】 命名空间与LEGB规则

    命名空间与LEGB规则 之前隐隐约约提到过一些关于Python赋值语句的特殊性的问题,这个问题的根源就在于Python中的变量的命名空间机制和之前熟悉的C也好java也好都不太一样. ■ 命名空间 所 ...

  2. Mysql的执行计划各个参数详细说明

    执行计划各个参数的说明 1.id 主要是用来标识sql的执行顺序,如果没有子查询,一般来说id只有一个,执行顺序也是从上到下 2.select_type 每个select子句的类型 a:  simpl ...

  3. 基于node写了个工具，可以在线制作“sorry，为所欲为”的 GIF(开源)

    SnailDev.GifMaker 一个生成gif并添加自定义字幕的工具 client 微信小程序 server nodejs + express 欢迎 star&fork 如果您有好的com ...

  4. Git常用命令（二）------ 远程库操作

    本文总结自廖雪峰网站. Git支持多种协议,git://使用ssh协议,速度最快,也可使用https等协议. 对远程库操作: 推送: 1.先远程建立一个Repo库,f 2.远程和本地关联: git r ...

  5. Java基础学习笔记十二 类、抽象类、接口作为方法参数和返回值以及常用API

    不同修饰符使用细节 常用来修饰类.方法.变量的修饰符 public 权限修饰符,公共访问, 类,方法,成员变量 protected 权限修饰符,受保护访问, 方法,成员变量 默认什么也不写 也是一种权 ...

  6. python IDLE中反斜杠显示为人民币符号￥的解决办法

    改换英文字体即可

  7. C作业--数据类型

    一.PTA实验作业 题目1:7-3 倒顺数字串 1. 本题PTA提交列表 2. 设计思路(伪代码) (1)本题是要求输入倒顺序数串,首先看到这种题肯定是需要用到循环,那就先定一个整形i来进行循环,n是 ...

  8. 第二次作业：APP案例分析

    App案例分析 产品:三国杀-页游手游双通 选择理由 当今社会手机已经渐渐取代了电脑在人们日常生活的需求,既然要选择APP进行案例分析,首推的估计就是手机APP了.三国杀是陪伴我高中时代的主要娱乐方式 ...

  9. Java的暑期作业

    Java暑期作业 一.<恶意>读书笔记 <恶意>是日本作家东野圭吾写的推理小说之一.看完后不禁为东野先生的奇特的写作手法以及书中所展现的人性的丑恶所震撼.我认为这本书相较< ...

  10. 201621123068 Week03-面向对象入门

    1. 本周学习总结 初学面向对象,会学习到很多碎片化的概念与知识.尝试学会使用思维导图将这些碎片化的概念.知识点组织起来.请使用工具画出本周学习到的知识点及知识点之间的联系.步骤如下: 1.1 写出你 ...