Iv’e been stuck the last few days with a seemingly simple problem to do with my big green banner on the homepage of www.JohnAlexanderRowley.com. The problem is that in Internet Explorer the fade animation causes .PNG’s to loose there alpha levels (transparency) and aquire ugly black borders for a few seconds while the animation completes.

To solve this, I wanted to use a set of IF statements (iv’e covered these previously in other IE-rant articles, but couldn’t figure why it wasn’t working this time. The soltion came after a fair while of googling and head scratching.

Rather than the simple <!--[if IE]>code if in Internet Explorer here<![endif]--> and then <!--[if !IE]>code if not in Internet Explorer here<![endif]-->. I had to use an extended version for the NOT IE (!IE). Here is what I used:

<!--[if !IE]><!-->code if not in Internet Explorer here<!--<![endif]-->.

It makes sence really, but took me ages to get my head around after I found it. Hope this helps someone as much as it helped me!

p.s. You’re NOT viewing in Internet Explorer!