PNG Transparency Solutions For IE6
April 27th, 2009I’ve never really played around with PNG transparency because of IE6s lack of support. But, recently I wanted to use it on a project, and I knew there’s a Microsoft solution using AlphaImageLoader. So I gave it a try, and it worked fairly well. Until I went to click a link. And then I tried highlighting text. No dice. I assumed it was a z-index issue, so after trying a couple things myself, I did a quick search online. I came across this article:
http://www.hrunting.org/csstests/iealpha.html
And, it worked! (Didn’t need to add a z-index, either.) Now, bear in mind that the fix is to *not* set positioning on the element that you use a filter on. So it may not be right for your project. However, if your layout does rely on position:relative, consider using this:
http://www.dillerdesign.com/experiment/DD_belatedPNG/
It’s a great JS library that easily whips IE6 into shape. I’m using it on a site that’s also using MooTools, and I’ve experienced no conflict issues, which is great.
I can’t wait until the percentage of IE6 users falls low enough to ease my mind about not supporting them. (I know many think it already has, but I’m holding on. At least for a little while.) The concession of sorts that I’ve made is that for IE6 users who don’t have JS enabled, obviously it’s not good news. But, in my opinion, to support both was just unnecessary.










