第一种:这个方案能解决大多数自适应高度问题,方法是在iframe所要加载的页面上添加代码,把它的高度告诉iframe所在页面。缺点显而易见,如果iframe要加载的页面非常多而且不固定那么代码加起来很麻烦。

$(function () {
fixParentHeight();
}); function fixParentHeight() {
var thisbodyheight = document.body.clientHeight;
$(window.parent.document).find("#iframe").height(thisbodyheight);
}

第二种:获取iframe与浏览器顶部的距离,用浏览器全高减去这个距离,得到iframe到底部的距离,将这个作为iframe高度。缺点是这个高度不能跟随iframe动态调整,如果iframe高度很小那么它还是会占据屏幕整个下半部分。

    function stretchHeight(targetobj, delta) {
var sf = function () {
var tableWrap = $(targetobj);
var tableOffset = tableWrap.offset();
var documentHeight = $(document.documentElement).height();
if ($.browser.msie) {
documentHeight = document.documentElement.clientHeight;
} else {
documentHeight = window.innerHeight;
}
var tableHeight = documentHeight - tableOffset.top - (delta == undefined ? 0 : delta);
tableWrap.height(tableHeight);
};
sf();
$(window).resize(function () {
sf();
});
}
stretchHeight($("#iframe"), 10);

iframe自适应高度处理方案的更多相关文章

  1. html之小积累-.-iframe自适应高度

    在做系统框架的时候,常常会用到iframe,当需求是iframe不能出现纵向滚动条,需要根据加载页面的高度,一致延伸,但是iframe的高度自适应问题比较麻烦,当时也是纠结了好久. 方案1:当遇到if ...

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

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

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

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

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

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

  5. js实现iframe自适应高度

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

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

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

  7. Iframe 自适应高度的方法!

    第一种方法:代码简单,兼容性还可以,大家可以先测试下. function SetWinHeight(obj) { var win=obj; if (document.getElementById) { ...

  8. iframe自适应高度的多种方法小结

    转自:http://www.jb51.net/article/15780.htm 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的大小 ...

  9. iframe自适应高度的多种方法方法小结

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的  不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 ifram ...

随机推荐

  1. 基于Redis的CustomerSessionProvider(一)

    CustomerSessionProvider需要实现SessionStateStoreProviderBase 在设计Redis Session Provider的时候,需要考虑 1.是否每个用户的 ...

  2. 我的API HOOK库

    API HOOK有两种做法,一种是SetWindowHookEx,简单易用,但如果做其它的HOOK,如HOOK OpenProcess,就需要修改内存地址了,内存地址可以通过WriteProcessM ...

  3. JS获取图片实际宽高

    JS获取图片实际宽高,以及根据图片大小进行自适应 <img src="http://xxx.jpg" id="imgs" onload="ada ...

  4. 服务端套接字类CxServerSocket的使用

    服务端套接字类CxServerSocket的使用 这是一个精练的服务端套接字类,类名.函数名和变量名均采用匈牙利命名法.小写的x代表我的姓氏首字母(谢欣能),个人习惯而已,如有雷同,纯属巧合. CxS ...

  5. ios学习笔记(二)之Objective-C类、继承、类别和协议

    二:Objective-C类与继承和协议 在前面已经提过了对象的初始化,这里首先讲的是变量. 2.1 变量 局部变量(内部变量): 局部变量是在方法内作定义说明的,其作用域仅限于方法内,离开方法后使用 ...

  6. Archives for the category: Fisheye/Crucible

    Archives for the category: Fisheye/Crucible Introducing FishEye and Crucible 3.0 – Search, visualize ...

  7. Broadcast Reveiver作用

    Broadcast Reveiver作用以及为何要引入(用来接收系统以及自定义消息的) 在系统内通知和判定执行状态 1,系统执行状态,开机了,TF卡插拔,准备关机,电量低了, 2,自定义执行状态,发消 ...

  8. Js-Html 前端系列--显示有格式的文本

    var dp = $("#dp").val(); var dpXSS = filterXss(dp); document.getElementById("descript ...

  9. .Net 生成条形码

    1,下面一个类,可以直接复制下去使用: public class Code39    {        private Hashtable m_Code39 = new Hashtable();    ...

  10. jquery中动态新增的元素节点无法触发事件解决办法

    在使用jquery中动态新增的元素节点时会发现添加的事件是无法触发的,我们下面就为各位来详细的介绍此问题的解决办法. 比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为“re ...