Features of this PNG fix:
- It will fix PNG images that are used as the SRC of an <IMG/> element.
- It will also fix PNG images that are set as a background-image in CSS.
- For a CSS background PNG image, background-position and background-repeat work as intended.
Setting up the PNG fix:
It’s quite simple to set up this PNG fix on your website. Simply follow these steps:
- Add function calls to DD_belatedPNG.fix() inside the DD_belatedPNG.js file like this
DD_belatedPNG.fix('.png_bg'); // argument is a CSS selector
This will fix the PNG background image for the .png_bg CSS class.
DD_belatedPNG.fixPng('img' ); // argument is an HTMLDomElement
This will fix your PNG <IMG/> element.
- You can even roll all your fixes into one statement like this:
DD_belatedPNG.fix('img, .dropdown, h1 span, #header');
That’s it, your transparent PNG images should now render properly in IE6! This is a great light weight PNG fix that should satisfy most web designers needs. This PNG fix does have a few limitations that can be seen in more detail at Drew Diller’s website.