Creating a dark semi-transparent modal overlay covering the whole page

This tutorial demonstrates how to do this with CSS and jQuery:

imageoverlay

I.e. placing a dark, semi-transparent, user-blocking/modal overlay (with a title in this case) over the whole page.

Works in all browsers including IE7. Doesn’t quite work properly in IE6 but may be acceptable.

 

 

Here are the images used:

overlay  overlay.png            spinner spinner.gif

 

Comments always welcome………………