How can I block and dim everything on a page with one exception?

I've tried using blockUI jQuery plugin to block the UI on a page. blockUI works fine but it seems there is no option to block everything except one element. I want to encourage a user to enter a value once per week so I want to block everything except the div containing a slider and input field.

I tried something like this

$('div.grid_12').not('#mydiv').block({ message: null });

but everything gets overlayed by blockUI, including #myDiv. I al开发者_如何转开发so tried hiking the z-index on #myDiv. This created problems with the jqueryUI slider which has its own z-index requirements. Unblocking #myDiv also has no effect. What I basically want is the reverse of this : http://jquery.malsup.com/block/#element

Does anyone know a solid way of doing this? Perhaps I could clone the div and overlay it somehow?

Using the following code:

<div id="mydiv" style="z-index:9999; position:relative;"></div>

Will override the z-index of the block, meaning your div will appear above it.