A brand new PNG fix for IE6

by: 
Dejan Cancarevic

It's been a while since last PNG fix for IE6 got out and as I've written back then it's not quite perfect and a bit buggy with the rest of JavaScript but now here's another one from Unit Interactive Labs, very fresh and promising, one of the first products of this company.

Also the second product so far from Unit Interactive Labs is a simple and useful tool tip rollover (named as UniTip) which also uses their PNG fix and it is very popular and used a lot these days over the web. Nice work Unit Interactive!

Unit PNG Fix

PNG fix

In their words this new png fix is inspired by work of 24ways.org, and here are some key features why you would use it. As far as I've tested it so far it's working fine.

  • Very compact javascript: Under 1kb!
  • Fixes some interactivity problems caused by IE’s filter attribute.
  • Works on img objects and background-image attributes.
  • Runs automatically. You don’t have to define classes or call functions.
  • Allows for auto width and auto height elements.
  • Super simple to deploy.

So as you see progress has been made, talking about background-image and auto height elements. To include it use standard procedure, download JavaScript (you can do it directly here) and put it between <!--[if lt IE 7]> and <![endif]--> in head tag. And there's a new thing, a small image "clear.gif" which in their words "keep certain elements structurally sound when using the filter property" so you'll need to change path in the JS afterwords .

UniTip

Tool tip

Another project worth a mentiong and also using their PNG fix is UniTip. This is now based on Craig Erskine’s qTip, It supports all browsers, is easy to deploy, and is surprisingly light-weight. Best of all: it offers you the opportunity to customize it to work well with any of your projects.

  • Vertically expands to content.
  • Can accept HTML.
  • You can apply UniTip to specific classes or tags.
  • Adjusts to sides and bottom of page.
  • Unit PNG Fix included in the zip to automatically fix pngs for IE6.
  • Easy to customize and deploy! Friendly with other scripts!

Installation is also simple, after a download include JavaScript and style in your head tag. For more information visit UniTip page.

helps a lot

I thougt i have to rebuild my complete navigation because of this png bug in ie.ver helpfull little script. thank you so much. it saved me a lot of time. big thanks for that!

reply

I hate having to use hacks for IE, but that’s just the way it goes. Since the W3C still reports that IE6 has a 25% market share as of August, I can’t let go of designing for it yet.

Post new comment

The content of this field is kept private and will not be shown publicly.
CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.
Image CAPTCHA
Copy the characters (respecting upper/lower case) from the image.