IE vs. PNG: The battle continues

Just when I thought I had figured out the rules of engagement between Internet Explorer and opacity, another hurdle arose. I figured with IE7 sporting brand-new native support for PNGs with an alpha channel that the best way to implement opacity (per my previous entry) would be to just use a semi-transparent PNG and assign it as a background image, letting the image tile to fill up the space. What I got was another unwelcome surprise: the client’s CPU spiked to 100% usage!

A few more tests confirmed my suspicions: tiling of semi-transparent PNGs in IE7 is a major problem. It causes the browser to go into a tailspin from which there is no recovery. The solution? I just went back to using the old AlphaImageLoader code…the CPU usage immediately went back to normal on the same page.

I really wish that the IE team would get their act together on this one. What use is having native transparent PNG support if it pegs the processor to the point of slowing down the entire machine? And how about getting opacity working without so much memory so that we don’t need to use PNGs for it?

Understanding JavaScript Promises E-book Cover

Demystify JavaScript promises with the e-book that explains not just concepts, but also real-world uses of promises.

Download the Free E-book!

The community edition of Understanding JavaScript Promises is a free download that arrives in minutes.