FixPNG

docs

This will make transparent png files show up correctly in IE6 and below. This function is based almost entirely on the function found here: http://homepage.ntlworld.com/bobosola/pnginfo.htm

Note that this method is only marginally useful and must be fired after the image loads. There is a new method here: http://www.twinhelix.com/css/iepngfix/ that is much more effective that I highly recommend using.

Here's a 24 bit png file with a transparency:

In IE, it'll look crappy. For those of you not using IE, here's what it would look like (this is a gif):

We can fix it:

Browser.fixPNG($('pngExample')); //fix the first img above
//again, IE6 and below ONLY; nothing will happen in other browsers

The library also has built in functionality to automatically fix DOM elements that have the class "fixPNG", so you don't really even have to write any javascript:

<img src="myImg.png" class="fixPNG">//fix this file when the dom is ready

Additionally, you can use fixPNG to do the same for background images. Here's a div with the same image above for the background:

The code is the same:

Browser.fixPNG('#fixPNGDivExample');
//again, IE6 and below ONLY; nothing will happen in other browsers

Note that the background cannot be tiled or offset with this method. Again, I recommend this method instead: http://www.twinhelix.com/css/iepngfix/