• 如何在ie6/ie7/ie8中实现iframe背景透明


    最近做了一个项目,涉及到ie8iframe背景透明的问题,做了老半天,才把它搞定的,现在把我的经历贴出来和大家分享:

    众所周知的根据W3C CSS 2.1 规范规定,''''background-color'''' 特性的默认值为 ''''transparent'''',即透明;但是IE6/IE7/IE8中 BODY 元素的背景色不是 transparent,而是 #FFFFFF;也就是变成了白色的。

    其实,有一点我们是要注意的,也是必须知道的,在iframe中这个背景是其本身,不是iframe内的html元素的,所以,只对iframe进行相关设置就能去掉这个背景。(你可以试一下哦)

    在iframe有个allowTransparency的属性这个属性就是控制它的透明度的,意思是是否允许透明;但是IE6/IE7/IE8中却是白色;所以我们可以这样加上它 <iframe allowTransparency="true" />,加上这个属性,想要的效果就出来了。但是有时候是会出现一些小的问题的,如果为了追求更好的保障的话,就要加上iframe{background: transparent;},这样你就可以的了。

    但还有一些特殊情况:有时候iframe不是HTML中本身写的,是加载进来的,这时虽然以上的CSS可以生效,但却没法给iframe本身加上allowTransparency属性了,这时候要怎么做?很简单给它来一段js代码:

    1  window.onload = function(){
    2     var ifra=document.getElementsByTagName(''''IFRAME'''');
    3         for(var i=0,l=ifra.length;i<l;i++) {
    4             ifra[i].setAttribute(''''allowTransparency'''',''''true'''');
    5         }
    6  }

    至此,你以为问题解决。可突然发现还是白色的背景,这是为什么呢?那是因为iframe中的 BODY 元素的背景色不是 transparent的,所以对iframe里的body也要设置透明化:background:transparent;由此可以看出,你要分清情况的,框架要透明,里面的元素也要透明设置的,请记住这个属性:background:transparent;

    以上文章有深圳网络公司易捷网络科技编写,转载时注明出处,谢谢合作。

  • 相关阅读:
    软解析和硬解析
    oracle存储过程常用技巧
    jquery-1.11.1.js
    JavaScript遍历table
    JavaScript向select下拉框中添加和删除元素
    glog
    DDL引发的对象invalidation
    模拟cursor pin S wait on X
    rsync 排除目录
    JavaScript解决select下拉框中的内容太长显示不全的问题
  • 原文地址:https://www.cnblogs.com/macliu/p/6388832.html
Copyright © 2020-2023  润新知