vendredi 15 octobre 2010

IE 8 and opacity on PNG 24

RRRAaaaa I had a dashboard with a lot of LEDs to display and some should be transparent to better focus on the important ones. Unfortunately, as usual, IE is a pain.

IE 8 has a bug in displaying the PNG 24 with an certain opacity, Raaaaa
There is absolutely no workaround! I finished by making another version of the LEDs with Photoshop with an opacity effect!

after I had to ensure that it was compatible IE6, Raaaa again
IE 6 has a issue with PNG transparency, so I had to use a different tag IMG with a workaround using

var tag_img = '<img class="led" src="images/blank.gif" width="13" height="13" border="0" style="filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\''+img_src+'\', sizingMethod=\'scale\');">'

with a very cool : if( $.browser.msie && $.browser.version.substr(0,1)==='6') {

It was probably not difficult enough with just IE6, we have now to support IE6 and IE8
Super I enjoy :-)

See you,
Sylvain