Question

As I have seen here, a filter can be used to simulate a cross browser version of

pointer-events: none;

However, this just doesn’t work in IE9, nor does it in the “emulate IE8” version in IE9. A native installation of IE8 handles it fine, however. Is there any solution that makes it work for IE9?

Answer 1

You’re right – AlphaImageLoader filter has been removed from IE9. This was done so that it doesn’t conflict with the standards compliant methods. In this case, pointer-events: none, which now works in IE9.

If you’re using a conditional comments to target IE for the filter fix, change them to target only IE8 and below. Try changing <!--[if IE]> to <!--[if lte IE 8]>

Edit: I’ve since come across this again and it appears that pointer-events: none does not work in IE9 (not for HTML elements anyway). I thought this was working, but on re-testing neither method works for click-through on IE9. Perhaps I had my IE9 in a compatibility mode.

It’s not ideal at all, but you could force IE9 into IE8 mode via the <meta> tag switch:

 <!--[if ie 9]><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"><![endif]-->

Apologies for the misinformation, I’ll keep looking into this.

Update Sept 24 2012:

The wonderfully useful caniuse.com has more information on pointer-events for HTML. Support in IE10 is still unknown and it appears that Opera does not support this property either. I would advise against using pointer-events for now unless you’re specifically targeting Webkit/Mozilla.