I’ve found this great method to properly display png files on IE which also works when using jQuery alpha effects on them.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | jQuery.fn.extend({ fixPNG: function(sizingMethod, forceBG) { if (!(jQuery.browser.msie)) return this; var emptyimg = "images/dot_alpha.gif"; //Path to an empty 1x1px GIF goes here sizingMethod = sizingMethod || "scale"; //sizingMethod, defaults to scale (matches image dimensions) this.each(function() { var isImg = (forceBG) ? false : jQuery.nodeName(this, "img"), imgname = (isImg) ? this.src : this.currentStyle.backgroundImage, src = (isImg) ? imgname : imgname.substring(5,imgname.length-2); this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + sizingMethod + "')"; if (isImg) this.src = emptyimg; else this.style.backgroundImage = "url(" + emptyimg + ")"; }); return this; } }); jQuery('#slideshow img').fixPNG(); |
Don’t forget to specify the path to an empty gif image above in order for this script to work.
