
IE8 Still Failing PNG Alpha - joshuacc
http://mezzoblue.com/archives/2010/05/20/ie8_still_fa/
======
niyazpk
So as you all know, there was no support for PNG transparency in IE6. People
came up with many solutions including using the filters in IE (or using VML).
When it was time for IE7, instead of working on actually fixing the problem,
the IE-team just started using the popular solution in IE6 (i.e. filters) for
fixing IE7 PNG problem . So now instead of the web developer calling the
filter, IE7 will do this for them.

Anyway it turns out that the CSS property _opacity_ is also implemented using
filters in IE. Also, it turns out that things will go haywire if more than one
filter is applied to the same element. This is happening in the above
mentioned blogpost.

Now the author of the article found that using VML instead of filters will
solve some of the problems in IE7. There is no known way to fix this issue in
IE8 other than using the _Emulate-IE7_ tag in the header (shudders).

What the author is about to discover soon is that VML + JQuery does not go
well either. Calling _element.type_ on VML elements (JQuery does this
internally all the time) may cause your browser to freeze up and require a
restart (in IE6, IE7, IE8) or cause JS error in (in IE9).

More stuff will break if you try to animate things around in the screen using
either of the solutions. And don't get me started with zooming in/out elements
with PNG transparency with opacity.

All I can say is that I wish you all the best.

BTW Here is an explanation from the author of the feature in IE7:
<http://blogs.msdn.com/b/ie/archive/2005/04/26/412263.aspx>

EDIT: Note that the issue with VML + JQuery is not just when you refer to a
VML element. It can happen even if you are referring to some other element in
your JQuery selector. The solution is to change your selectors randomly (i.e.
being more/less specific) until the selector does not give an error, but this
is not guaranteed to work all the time. You can try editing JQuery itself to
fix the issue, but there are many places you will have to edit, it is just a
PITA. The JQuery team may fix this issue from their side though.

------
fungi
ugh ran in to that about a month ago when doing some fades on a header
carousel, our solution was to swap all png's for 8 bit png's during the fade
then swap back when done... fucking ridiculous and less then perfect to the
discerning eye.

the depth and breadth of ie bugs is amazing, ive been doing this shit for
years but big uglys like this still just keep popping up.

zoom: 1 wtf is that?

~~~
pbhjpbhj
>zoom: 1 wtf is that?

Not sure if that's incredulity or a genuine question - it forces (the
internal, once hidden, secret) hasLayout flag to be set in MSIE browsers but
does nothing else (visually) and is ignored by other browsers. Unfortunately
it's not a standard attribute and so compliance checks fail.

------
thwarted
I like the implication of the first comment, that doing alpha channel stuff is
_at least_ older than Internet Explorer, and almost as old as Microsoft.

------
ComSubVie
As a side note: it doesn't work with the "Reader" feature of Safari - the
background of these images is always white (with a small dark bullet on the
bottom right).

------
devmonk
Why do people keep talking about IE8? Is it true for IE9?

~~~
niyazpk
Because IE9 has 0% market share, and IE8 has around 28%. And no, this specific
issue is not there in IE9.

------
tomjen3
A simple solution: send it out in gif, the patents have expired at this point
and it actually works.

It properly doesn't look as good, but thats what you get for using a crap
browser.

~~~
duskwuff
Except GIF doesn't have alpha at all. GIF only has binary transparency, and
that part of PNG works fine in all versions of IE.

~~~
tomjen3
D'oh -- well color we retarded then.

