转自: http://www.cnblogs.com/luluping/archive/2009/04/17/1437843.html

超级简单的方法,也不用写什么判断浏览器高度、宽度啥的。
下面的两种方法自选其一就行了。一个是放在和iframe同页面的,一个是放在test.html页面的。
注意别放错地方了哦。

iframe代码,注意要写ID

<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>

jquery代码1:

//注意:下面的代码是放在test.html调用
$(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height()+30;
main.height(thisheight);
});

jquery代码2:

//注意:下面的代码是放在和iframe同一个页面调用
$("#main").load(function(){
var mainheight = $(this).contents().find("body").height()+30;
$(this).height(mainheight);
});

测试过,第二种有效,不过要注意一点是,增加的JS要写在iframe下面,放在头部是测试没有效果。
测试代码:

                <iframe id="mainframe" name="mainframe" marginwidth="0" marginheight="0" src="/Home/Activitylist"
frameborder="0" width="100%" scrolling="no" height="100%"></iframe>
<script type="text/javascript">
//注意:下面的代码是放在和iframe同一个页面调用,放在iframe下面
$("#mainframe").load(function () {
var mainheight = $(this).contents().find("body").height() + 30;
$(this).height(mainheight);
});
</script>

jquery 实现iframe 自适应高度的更多相关文章

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

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

  2. jquery 清空 iframe 的内容,,iframe自适应高度

    $(iframe).contents().find("body").html(""); iframe自适应高度 $("#AllDescription& ...

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

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

  4. 让iframe自适应高度-真正解决

    需求:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象. (需要只有iframe出现滚动条) 本人一开始这么写:会造成只有主页面加载是设定 ...

  5. [转]让iframe自适应高度-真正解决

    原文地址:https://www.cnblogs.com/rogge7/p/7762052.html 需求:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同 ...

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

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

  7. iframe自适应高度处理

    一中方法: 在子页面加载完毕的时候执行 parent.document.getElementById("iframe").height=0; parent.document.get ...

  8. js实现iframe自适应高度

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

  9. 网页制作技巧:iframe自适应高度

    转自:http://www.enet.com.cn/article/2012/0620/A20120620126237.shtml 通过Google搜索iframe 自适应高度,结果5W多条,搜索if ...

随机推荐

  1. 解决Unknown error: Unable to build: the file dx.jar was not loaded from the SDK folder!

    解决Unknown error: to the dx.jar the SDK folder!最近渐渐迁移到Android Studio来了,更新过Android SDK Manager里的东西后,打开 ...

  2. ESlint全局变量报错

    场景: 在main.js下申明了全局变量: /* eslint no-undef: "error" */ window.vm = new Vue({ el: '#app', rou ...

  3. Sencha Touch 实战开发培训 视频教程 第二期 第三节

    2014.4.11晚上8:10分开课. 本节课耗时一小时以上. 本期培训一共八节,前两节免费,后面的课程需要付费才可以观看. 本节内容:             本地储存.扩展按钮控件.微博分享 实现 ...

  4. C语言中scanf函数的实现

    接上一篇C语言中可变参数函数实现原理,从理论上详细介绍了C语言中可变参数函数的实现,这一篇从minix内核源码中的scanf函数入手,学习C语言经典可变参数函数的实现过程 在scanf.c文件中,可以 ...

  5. Hive FUNCTIONS函数

    hive> SHOW FUNCTIONS; ! != % & * + - / < <= <=> <> = == > >= ^ abs ac ...

  6. 关于python爬虫的编码错误

    现在才发现很多错误只有自己一点点的去尝试才能发现.不管之前别人怎么和你说,总是不可能面面俱到,所以提升自己的方法就是亲手实践,自己一点点的去发现问题,并一个个的解决.慢慢享受其中无言的快感. 今天就发 ...

  7. parameter/argument

    根据网上一些资料,对parameter和argument的区别,做如下的简单说明.1. parameter是指函数定义中参数,而argument指的是函数调用时的实际参数.2. 简略描述为:param ...

  8. 微信都在用的移动敏捷测试方法和工具|视频+PPT

    本文是腾讯优测总监雷彬在MPD2016 北京站上的演讲视频.他详细讲述了腾讯多年来在实践敏捷研发过程中测试的优化之路,为测试角色(包括测试工程师和开发自测)提供敏捷作业的思路.点击此处观看视频.时长5 ...

  9. CONVERT(varchar(10), getdate(), 120 )中数字参数用法

    这是一个mssql数据库的函数,Convert函数的作用,是进行数据类型的转换.而您所问的这个convert(char(20),openDate,120)则是对日期字段,进行格式化转换成字符格式的函数 ...

  10. hadoop HA架构安装部署(QJM HA)

    ###################HDFS High Availability Using the Quorum Journal Manager########################## ...