Blocking all input behind an invisible div in IE?

Question

I have a "Saving..." overlay that occupies the center of an invisible div that covers 100% of the screen. I would like it to be impossible to interact with the elements behind it, i.e. clicking the buttons, selecting form inputs, etc. Ideally it would not only catch all mouse inputs, but also ignore the mouseover effects(namely cursor changes) of the elements below. It's not for security or anything so it doesn't need to be airtight, mainly just for aesthetics.

Firefox appears to do exactly this by default, but IE doesn't at all. Is there something simple I can use to enforce this behavior in IE?

Answer 1

I suggest you look into one of the many MooTools UI libraries, for instance Clientcides StickyWin Modal. It prevents interaction with things below it to some extent (like you said, mostly asthetically). The user can still tab through things below and if they cared to, interact with forms...

Answer 2

IE will only block user interaction when the div covering the screen has a background color. If you don't want your content hidden, set a background color, and set the opacity to 1%.

background-color: white;
filter: alpha(opacity=1);
opacity: 0.01;