主页面嵌入iframe,但是iframe高度不是自适应的,一旦iframe中的内容超过了iframe框的大小就会出现滚动条,导致页面非常难看。现有的iframe高度自适应有以下4中情况,其中第四种是无法解决的
1.主页和iframe页面属于
相同域名,不存在js跨域问题
这种情况很简单,如果你使用jquery
var frame = $("#frameId");
//拿到你所需要的页面的contents,这个可以结合firebug,打断点查看
var content = frame.contents()[0];
//拿到页面body对象
var body = content.body;
var height = body.scrollHeight
frame.attr("height",height);
如果你没有使用jquery
var ifm= document.getElementById(id);
var subDocument = null;
if($.browser.msie){
subDocument = window.frames[id].document;
}else{
subDocument = ifm.contentDocument;
}
if(ifm != null && subDocument != null) {
var height = subDocument.body.scrollHeight;
ifm.height = height;
}
2.主页和iframe嵌入页属于不同域名,但存在合作关系,即,iframe嵌入页面能为你加入js脚本
这种情况,稍麻烦,担不是很复杂,下面这篇博客说的很清楚,可以参考一下
http://www.cnblogs.com/qgd87/archive/2010/07/16/1778980.html
3.主页和iframe嵌入页面属于不同域名,也没有任何关系,但是主页使用frameset布局
<frameset cols="*" rows="20,*">
<frame id="master" src="主页需要显示的内容但如抽取成一个页面">
<frame id="customer" src="嵌入页面的url">
</frameset>
使用这种模式,需要在项目开始的时候就设计好, 主站也使用这种框架,否则站点操作相应页面会成为一个大问题
4.主页和iframe嵌入页面属于不同域名,也不使用3中的解决方案
这种情况,暂时还没有解决方案,也可能是我孤陋寡闻,呵呵,有知道的说一下哈
分享到:
相关推荐
iframe高度自适应代码及演示页面。 适合新手,用到iframe,并且需要高度自适应的人士。 老手自动绕行,又没什么技术含量。。。 解压之后,打开iframe-auto.html之后查看效果. 如果不能查看,检查是否允许执行js
Iframe 高度自适应,js控制Iframe 高度自适应.docx
iframe包含的页面的高度,兼容性好,iframe高度自适应
iframe高度自适应.pdf
根据iframe内容高度自适应。不能确保所有的地方都能通用,但是大部分地方都能适用。
NULL 博文链接:https://jxdwuao.iteye.com/blog/1243362
jsp页面iframe高度自适应的js代码.docx
用jquery实现iframe高度自适应实例代码完美兼容多数浏览器
文件为iframe高度自适应的代码demo,能够兼容常用浏览器,项目开发当中我常拿来用
iframe 跨域 自适应高度 模板 iframe 跨域 自适应高度 模板 iframe 跨域 自适应高度 模板
iframe高度自适应,多浏览器兼容 已测试过在ie6,7,8,firefox8,chrom15中通过
通用,可行的iframe高度自适应程序,通过ie6-ie8,ff3.5,opera,google为代表的前大内核的浏览器,可以保证iframe 高度自适应,其中涉及调第三方程序设置站点session
Iframe自动根据类容改变自己的大小,解决Iframe设置高度后无法缩小!拜一个高人所赐,特表示感谢!
iframe自适应高度和宽度
纯JS实现的iframe自适应高度。兼容主流浏览器。
这个库允许的高度与同跨域iframe来适应他们所包含的内容的宽度自动调整大小。它最常见的问题与使用iframes提供一系列的功能,其中包括: 高度和宽度大小的iframe内容大小。 作品以多个嵌套的iframe。 跨域iframe域...
iframe高度自适应及隐藏滚动条的实例详解 在工作中,我们可能会遇到自己公司和其他的公司达成合作关系,从而共同开发某个项目。而这时候,我们可能就需要在自己的网站上嵌入别人做好的页面。而这种情况下,我们一般...
解决IE,Firefox,chrome,safari浏览器中iframe显示高度自适应问题