第一种:这个方案能解决大多数自适应高度问题,方法是在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. HttpActionDescriptor,ASP.NET Web API又一个重要的描述对象

    HttpActionDescriptor,ASP.NET Web API又一个重要的描述对象 通过前面对“HttpController的激活”的介绍我们已经知道了ASP.NET Web API通过Ht ...

  2. JS错误:Uncaught SyntaxError: Unexpected token ILLEGAL

    $('tbody', '#' + tableId).append('<tr onmouseover="this.style.backgroundColor=\'#eeeeee\'&qu ...

  3. 前端开发的使用服务器环境开源项目 D2Server 可替代Apache

    推荐一个前端开发的使用服务器环境开源项目 D2Server 可替代Apache   攻欲善其事,必先利其器.前端开发,编辑器我们有了Sublime Text2,配置Server环境用……你可能会选择A ...

  4. WCF 学习笔记之双工实现

    WCF 学习笔记之双工实现 其中 Client 和Service为控制台程序 Service.Interface为类库 首先了解契约Interface两个接口 using System.Service ...

  5. Servlet部署描述文件(web.xml)

    最近看了下配置文件(Deployment Descriptor:简称DD),又称部署描述文件,下面详细介绍下该文件的组成和作用: 一.<web-app>有四个属性: 1.xmlns:申明了 ...

  6. zoj1537- Playing with a Calculator

    http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=537 题意:给你一个k值,现在要你求一个最小的N 值,N每一个数位上的数值a均相 ...

  7. Linux内核源代码

    说明:只供学习交流 一,目录结构 Linux内核源代码采用树形结构进行组织,非常合理地把功能相关的文件都放在同一个子目录下,使得程序更具有可读性. 二,目录结构 arch目录 arch是archite ...

  8. 动态SQL语句:定义(一)

    文章系列 动态SQL语句:定义(一) 静态SQL与动态SQL 静态SQL:程序运行前,具有固定的形式和结构的SQL. 动态SQL:程序运行时,能够动态改变形式或结构的SQL. 一些思考和想法 在实际的 ...

  9. C#开发学习——web服务器端控件

        Asp.net在客户端开发和web开发所用到的控件还是有很大的差别的,而且Web开发的界面是在浏览器中显示的,所以控件的设计都和前边学习HTML设计有联系,没有客户端开发那么简单,不过我们可以 ...

  10. springboot学习笔记-1 第一个springboot示例

    springboot是一个微框架,其设计的目的是为了简化spring框架的搭建和配置过程.从而使开发人员不再需要定义样板化的配置.下面是springboot的入门案例:它演示了利用springboot ...