zoukankan      html  css  js  c++  java
  • 解决ie6下png背景不能透明bug

    /*第一种方法:通过滤镜 使用css解决的办法。 注意滤镜下的1像素透明gif的覆盖图片的路径是相对页面写的*/

    /*注意:这个方法不适合处理img标签引入的png图片,代码太冗余了*/

    .banner img{
    azimuth: expression(
    this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
    this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
    this.src = "img/blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
    this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
    this.runtimeStyle.backgroundImage = "none")),this.pngSet=true);
    }

    /* 只用css的ie6 下png透明背景处理办法   但是:有一个很致命的缺点,不支持css精灵 不支持background-position*/
    _background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://i.tq121.com.cn/i/english/home/alarm.png");

    //第二种方法:通过js脚本方法  适合处理IE6下的img标签引入的png

    function fixPng() {
      var arVersion = navigator.appVersion.split("MSIE")
      var version = parseFloat(arVersion[1])

      if ((version >= 5.5 && version < 7.0) && (document.body.filters)) {
        for(var i=0; i<document.images.length; i++) {
          var img = document.images[i];
          var imgName = img.src.toUpperCase();
          if (imgName.indexOf(".PNG") > 0) {
            var width = img.width;
            var height = img.height;
            var sizingMethod = (img.className.toLowerCase().indexOf("scale") >= 0)? "scale" : "image";
            img.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + img.src.replace('%23', '%2523').replace("'", "%27") + "', sizingMethod='" + sizingMethod + "')";
            img.src = "img/blank.gif";
            img.width = width;
            img.height = height;
            }
          }
        }
      }

    fixPng();
  • 相关阅读:
    Jasmine入门
    最近面试js部分试题总结
    最近面试前端面试题整理(css部分)
    开发自己的类库
    关于FEer发展方向的思考
    工作那些事(八)工作的目标——《360周鸿祎在新员工入职培训上的讲话》读后感
    工作那些事(七)选择与被选择
    工作那些事(六)谈谈好的编程习惯的好处
    工作那些事(五)谈谈项目资料整理和积累
    工作那些事(四)大公司VS小公司
  • 原文地址:https://www.cnblogs.com/liujinyu/p/3578004.html
Copyright © 2011-2022 走看看