360浏览器极速模式对iframe的支持

今天有个网站的网页出现在360浏览器兼容模式下显示正常,在360浏览器极速模式下显示不正常。按照日常经验排查了各种可能出现的问题,但是都没有效果。后来开始怀疑是不是iframe的问题,但是iframe也正常处理了高度显示了。十分的困惑不解,后来上网查了下发现是360浏览器极速模式对iframe不支持。因为360浏览器极速模式是基于谷歌的内核,找到方向之后开始着手处理。

一开始网页按照这种方式处理,ie、ff等的浏览器都可以但是360浏览器极速模式下不可以

<iframe style="Z-INDEX: 2; VISIBILITY: inherit; WIDTH: 98%; HEIGHT: 100%" marginwidth="0" frameborder="0" scrolling="no" id="articleMain"  name="articleMain"
onload="document.all['articleMain'].style.height=articleMain.document.body.scrollHeight ”    >

现在在网上大神的帮助下按照这种方式处理完美解决。如下:

在嵌套的子网页中加入如下代码:

<script type="text/javascript">
function iframeAutoFit() {
   try {
     if(window != parent) {
       var a = parent.document.getElementsByTagName("IFRAME");
       for(var i = 0; i < a.length; i++) {
         if(a[i].contentWindow == window) {
           var h1 = 0, h2 = 0, d = document, dd = d.documentElement;
           a[i].parentNode.style.height = a[i].scrollHeight +"px";
           a[i].style.height = "10px";
           if(dd && dd.scrollHeight) {
             h1=dd.scrollHeight;
           }
           if(d.body) {
             h2 = d.body.scrollHeight;
           }
           var h = Math.max(h1, h2);
           if(document.all) {
             h += 4;
           }
           if(window.opera) {
             h += 10;
           }
           a[i].style.height = a[i].parentNode.style.height = h +"px";
         }
       }
     }
   } catch(ex) {}
}

if(window.attachEvent) {
   window.attachEvent("onload", iframeAutoFit);
} else if(window.addEventListener) {
   window.addEventListener("load", iframeAutoFit, false);
}  
</script>  


猜你喜欢

转载自blog.csdn.net/gtlishujie/article/details/78730998