可以使用iframe-resizer
项目地址: http://davidjbradshaw.github.io/iframe-resizer/
演示地址: http://davidjbradshaw.com/iframe-resizer/example/

用法:
1.父页面: 引入jQuery.js 和 iframeResizer.min.js

<script>
jQuery(function($){
$('#js_iframe').iFrameResize();
})
</script>

2.
Iframe, 需要进行如下设置, 宽度设置成百分比,  scrolling设成no .

eg. <iframe width="100%" height="240" src="xx/iframe.html" scrolling="no"></iframe>

3.iframe页面: 引入jQuery.js 和 iframeResizer.contentWindow.js

另外, 兼容IE8+, 添加

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

  

  

跨域的iframe自动调整高度(cross-domain iframe resizer)的更多相关文章

  1. Iframe跨域嵌入页面自动调整高度的办法

    http://www.a.com/A.html http://www.a.com/B.html http://www.a.com/D.js http://www.c.com/C.html A.html ...

  2. Iframe跨域JavaScript自动适应高度

    重点分析: 主域名页面:页面A,页面C 其它域名页面:页面B 步骤: 1.页面A(主域名)通过Iframe(id="iframeB")嵌套页面B(其它域名) 2.页面B(其它域名) ...

  3. iframe自适应高度计算,iframe自适应

    计算页面的实际高度,iframe自适应会用到 IfrHeight: function (iframeId, callback) { var height; function calcPageHeigh ...

  4. JS、JQuery和ExtJs的跨域处理

    1.什么是跨域?跨域,JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.简单地理解就是因为JavaScript同源策略的限制,a.com 域名下的js无法操作b.com或是c.a. ...

  5. JavaScript 跨域小总结

    一. 什么是跨域 域名分为:一级域名.二级域名.三级域名.例如:baidu.com(一级域名) .www.baidu.com(二级域名)tieba.baidu.com(二级域名).bbs.youa.b ...

  6. Nginx反向代理和Node.js后端解决跨域问题

    最近在写自己的博客,涉及到跨域的问题,自己捣鼓许久,终于解决了.然后总结一下,记录一下,日后遇到类似的问题的时候也可以得到一些启发. 一.什么是跨域 跨域,指的是浏览器不能执行其他网站的脚本.它是由浏 ...

  7. iframe 完全跨域自适应高度

    1.跨域访问页面, 需要访问后台的页面,通过后台调转 2.跨域自适应宽高   思路:通过相互嵌套,获取跨域页面的高度,通过src传回到本域,通过parent方法设置主页的iframe的高度 index ...

  8. js iframe跨域访问

    1.什么是跨域? 2.前台解决跨域几种方法 2.1 动态创建script 2.2 使用document.domain 2.3使用HTML5新属性postMessage 2.4 利用iframe和loc ...

  9. iframe跨域+

    script.image.iframe的src都不受同源策略的影响.所以我们可以借助这一特点,实现跨域.如前面所介绍的JSONP跨域,以及灯标(Beacons). 该篇随笔主要阐述iframe结合一些 ...

随机推荐

  1. SQL SERVER大数据分页

    select * from (select rownum r, a.* from (select * from  table_name order by ndatetime desc ) a wher ...

  2. 【扩展欧几里得】BAPC2014 I Interesting Integers (Codeforces GYM 100526)

    题目链接: http://codeforces.com/gym/100526 http://acm.hunnu.edu.cn/online/?action=problem&type=show& ...

  3. H-Index ——Leetcode

    Given an array of citations (each citation is a non-negative integer) of a researcher, write a funct ...

  4. vtk 中文显示

    参考文章: http://www.vislab.cn/bbs/viewthread.php?tid=5079&page=1&extra=#pid19477 http://tieba.b ...

  5. NeoOcean - Unity3D Ocean Waves Simulation

    GMail: bearworks8@gmail.com QQMail:196221347@qq.com QQ Group:391782326 Dropbox Demo:  https://www.dr ...

  6. [Locked] Alien Dictionary

    Alien Dictionary There is a new alien language which uses the latin alphabet. However, the order amo ...

  7. HTML参考手册

    New : HTML5 中的新标签. 标签 描述 <!--...--> 定义注释. <!DOCTYPE>  定义文档类型. <a> 定义锚. <abbr> ...

  8. D - How Many Answers Are Wrong(hdu 3038)

    总算碰到一道不那么无聊的题了^^ 先说一下题意吧,有两个人一个叫TT的男孩一个叫FF的女孩(名字太随意了吧....),这个叫TT的男孩会经常叫这个女孩一起玩一个游戏,这个有些是这样的,随便写一个数列, ...

  9. 在asp.net中使用confirm可以分为两种:

    在asp.net中使用confirm可以分为两种: 1.没有使用ajax,confirm会引起也面刷新 2.使用了ajax,不会刷新 A.没有使用ajax,可以用StringBuilder来完成. ( ...

  10. Redis 与 Memcached 的区别

    [转]Redis 与 Memcached 的区别 传统 MySQL + Memcached 架构遇到的问题     实际上 MySQL 是适合进行海量数据存储的,通过 Memcached 将热点数据加 ...