`
blue2048
  • 浏览: 178457 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

iframe 高度 自适应

阅读更多
主页面嵌入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中的解决方案

   这种情况,暂时还没有解决方案,也可能是我孤陋寡闻,呵呵,有知道的说一下哈
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics