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. JDK1.8源码(五)——java.util.ArrayList 类

    关于 JDK 的集合类的整体介绍可以看这张图,本篇博客我们不系统的介绍整个集合的构造,重点是介绍 ArrayList 类是如何实现的. 1.ArrayList 定义 ArrayList 是一个用数组实 ...

  2. 安装php扩展 ffmpeg-php

    环境: CentOS 6.5 PHP5.6 安装前php 已加载GD 模块(yum install php-gd)1.添加ffmpeg和ffmpeg-devel源 cat > /etc/yum. ...

  3. 多线程使用Lock实现生产者实现者代码

    package cn.com.servyou.qysdsjx.thread; import java.util.ArrayList; import java.util.List; import jav ...

  4. 用SQL语言操作数据

     使用T-SQL插入数据(一)SQL是什么?Structured   Query   Language  :结构化查询语言T-SQL:Transact-SQLT-SQL是SQL的增强版对功能进行了扩充 ...

  5. js版九宫格拼图与启发式搜索（A*算法）

    九宫格拼图游戏大家都很熟悉,这里给大家如介绍何应用状态空间搜索的方式求解拼图的最佳路径和一个游戏dome及自动求解方法: 本文分web版游戏的实现和启发式搜索算法两部分: 先看dome,直接鼠标点击要 ...

  6. 分区表SQL调优/优化（Tuning）时容易“被欺骗”的场景之一

    近几天没有用户找到,除了看看书,就是上网浏览点东西,好不惬意.可惜好景不长,正在享受悠闲惬意的日子时,一个用户的工作人员QQ找到我,说他们在统计一些数据,但一个SQL特别慢,或者说就从来没出过数据,我 ...

  7. Ubuntu16.04安装postgresql9.4及pgadmin3图形管理界面

    参考原文链接:http://www.cnblogs.com/sparkdev/p/5678874.html 安装前的检查 首先查看是否已经安装了旧版本: dpkg -l |grep postgresq ...

  8. 冲刺No.4

    Alpha冲刺第四天 站立式会议 项目进展 今日团队开始对项目的核心功能中的事务管理员模块与学生模块进行了编码,主要内容是对学生基本信息的增删改与事务管理员信息的增删改,这部分的内容是整个项目最基础的 ...

  9. 201621123043 《Java程序设计》第3周学习总结

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

  10. git基本语法

    基本用法(上)               一.实验说明 本节实验为 Git 入门第一个实验,可以帮助大家熟悉如何创建和使用 git 仓库. 二.git的初始化 在使用git进行代码管理之前,我们首先 ...