Internet Explorer: Disabling clicks on a page

Disabling clicks on a webpage should be easy: put a div in front of it with a fixed position which should get all clicks. With IE that is not easy because a completely transparent element will forward clicks to the underlying element. Some solutions I found:

Alpha filter with background

Adding these CSS properties (IE8 and later):

filter:alpha(opacity=0);
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
background:black;

The idea is that the element is not a transparent (it has a background) but the filters will still render it with no opacity. In IE8 this will result in the underlying elements not being printed if printing is required.

Using transparent background PNG

background:url(images/transparent.png) no-repeat; 

This works nicely in IE8 and IE9.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s