PNG transparency in IE6
Ways in fixing PNG transparency in IE 6:
1. Use of the IE PNG fix created by this site http://www.twinhelix.com/css/iepngfix/. This script use css declaration, supports <IMG SRC=”"> image elements and background PNG images.
2. The script below automatically activates the transparency for PNGs in your pages without any css declaration. Supports <IMG SRC=”"> image elements and background PNG images.
The code of iepngfix.js:
window.attachEvent(“onload”, enableAlphaImages);
}
function enableAlphaImages(){
var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, ”);
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
if (itsAllGood) {
for (var i=0; i
var bg = obj.currentStyle.backgroundImage;
var img = document.images[i];
if (bg && bg.match(/\.png/i) != null) {
var img = bg.substring(5,bg.length-2);
obj.style.filter =
"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+images+"', sizingMethod='scale')";
obj.style.backgroundImage = "url('images/blank.gif')";
} else if (img && img.src.match(/\.png$/i) != null) {
var src = img.src;
img.style.width = img.width + "px";
img.style.height = img.height + "px";
img.style.filter =
"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+src+"', sizingMethod='crop')"
img.src = "images/blank.gif";
}
}
}
}
How to use:
1.Copy and paste iepngfix.js and images/blank.gif into your website folder.
2. Put the code below between your <head>…..</head>
<script src="iepngfix.js" type="text/javascript"></script>
3. Make sure you declare the correct path of your blank.gif in iepngfix.js. Otherwise, you will see a “broken image” graphic!
Download blank.gif and iepngfix.js or visit this link to see the script in action: Demo
