Friday, December 19, 2008

Cool PNG fix for IE6

This fix will automatically apply to all background images as well as in img tags:

SuperSleight adds a number of new and useful features that have come from the day-to-day needs of working with PNGs.

* Works with both inline and background images, replacing the need for both sleight and bgsleight
* Will automatically apply position: relative to links and form fields if they don’t already have position set. (Can be disabled.)
* Can be run on the entire document, or just a selected part where you know the PNGs are. This is better for performance.
* Detects background images set to no-repeat and sets the scaleMode to crop rather than scale.
* Can be re-applied by any other JavaScript in the page – useful if new content has been loaded by an Ajax request.


Implementation:

Getting SuperSleight running on a page is quite straightforward, you just need to link the supplied JavaScript file (or the minified version if you prefer) into your document inside conditional comments so that it is delivered to only Internet Explorer 6 or older.

<!--[if lte IE 6]>
<script type="text/javascript" src="supersleight-min.js"></script>
<![endif]-->

Download : http://24ways.org/code/supersleight-transparent-png-in-ie6/supersleight.zip

No comments: