====== FixPNG ====== [[http://www.clientcide.com/docs/Browser/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:


//fix this file when the dom is ready

==== background images ==== 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/]]