Is there a plugin in Jquery which blocks the entire page except for certain content?

I've checked out the block UI plugin in Jquery which puts an overlay over any specific eleme开发者_JS百科nt - but what if I want to apply an overlay to the entire page except for a certain area in the page? Like all contents of a div - irrespective of the divs size.

Using the same plugin, or any overlay/modal plugin, you could use js to set a higher z-index on the parent element of the content you want to show than the z-index of the overlay.

Not sure how you want to do this, so you'll probably have to increase and decrease the z-index of the elements you want to show/hide. Since you said you're using jQuery, its probably easiest just to addClass() and removeClass(). Just make sure to set the position so z-index will work.

.show-me-over-the-overlay {z-index:99999999;position:relative}

Hopefully this will give you some ideas. GL!

Check out

http://flowplayer.org/tools/demos/toolbox/expose/index.html

http://flowplayer.org/tools/demos/overlay/trigger.html

Ali ,

I had a similar requirement and i am using a hidden div with a higher z-index which covers everything apart from the area you want.

it looked simple and useful for me.

blockUI provides you this ability.

$.blockUI();

See the page blocking examples