Transparent GIF, PNG Issues (IE + pngbehavior.htc)

PNG Behavior

Below is the complete source for the behavior. Notice that the behavior will only do anything if the user is using IE55+ on a Win32 platform.

CODE

function fixImage() {
if (realSrc && element.src == realSrc) {
   // this is an attempt to set the image to itself!
   // pointless - leave the filter as-is, restore the blank image
   element.src = blankSrc;
} else {
   // set the image to something different
   if (IS_PNG.test(element.src)) {
    // fixable PNG
    realSrc = element.src;
    realWidth = element.width;
    realHeight = element.height;
    alert(realSrc + ' ' + realWidth + 'px' + ' ' + realHeight + 'px');
    element.src = blankSrc;
    element.style.width = realWidth + 'px';
    element.style.height = realHeight + 'px';
    element.runtimeStyle.filter =
"progid:DXImageTransform.Microsoft.AlphaImageLoader
(src='" + encodeURI(realSrc) + "',sizingMethod='crop')";
   } else {
    // ordinary image - make sure the fix is removed
    if (realSrc) {
       realSrc = null;
       element.runtimeStyle.filter = '';
    }
   }
}
}

Usage

The usage is really simple. All you need to do is to add the png behavior to the image element.

img {
behavior: url(“pngbehavior.htc”);
}