Advertisement
Transparency in Internet Explorer is always a big issue for all Web Designers. There are a lot of compatibility problems with Internet Explorer 6. We have to design our website base on Firefox/Opera/Chrome, and then try it with Internet Explorer.
One of the major concern about IE6 is the transparency problem. IE6 can’t render transparent PNG image properly. As the result, your transparent and glassy design will become messy in IE6.
Luckily, there are a few solutions which can help web designer overcome the IE6 transparency problem. Each of them uses different method. Today, we are going to briefly look into these 6 methods. Please read the documentation while you are considering which method to use.
1. jQuery.pngFix.js
This solution requires jQuery and ables to work with CSS Backgrounds. To use this method, simple add both jQuery and pngFix plugin at your header section and then activate pngFix on document.ready.
2. DD_belatedPNG
DD_belatedPNG is another Javascript solution for youe IE6/PNG problem. In order to use this solution, simply add it to your document, call DD_belatedPNG.fix togother with the CSS selector.
3. TwinHelix IE PNG Fix
TwinHelix’s solution requires the use of behavior CSS property. You are required to upload a “iepngfix.htc” and a “blank.gif”. More configurations needed compare to the earlier solutions.
4. IE7.js
IE7.js is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6.
5. Unit PNG Fix
Unit PNG Fix will run automatically and make all PNGs transparent by default. It does not work with background-repeat.
6. PNG In Windows IE
Simply include 3 lines of code and you will get transparency for all your PNG files. This method uses the “defer” keyword, this trick causes the images to be replaced before they are rendered.
