透明PNG在IE6下的官方解决方案


Posted on May 8, 2009


做Web开发的朋友一定都知道PNG是一个相当不错的图片格式,但是这个好的格式却在IE6时代造成了麻烦,IE6会使透明的PNG的透明部分出 现#DBEAED的色彩。透明不了。使得在FF下开发表现很好的界面换成IE浏览就惨不忍睹,又逼着换成GIF,而GIF的假透明在变换背景时造成毛边现 象。

网上找到如下解决方案:

核心函数贴出来供分析

    /*
    Correctly handle PNG transparency in Win IE 5.5 & 6.
    Copyright 2007 Ignia, LLC
    Based in part on code from from http://homepage.ntlworld.com/bobosola.
    
    Use in  with DEFER keyword wrapped in conditional comments:
    
    
     */
    
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 = "images/blank.gif";
                    img.width = width;
                    img.height = height;
                }
            }
        }
}

fixPng();

标签:N/A

 

在线学习答案查询入口
微信扫码联系
微信扫码联系