jQuery UI overlay without dialog [duplicate]

Question

This question already has answers here:

Closed 7 years ago.

Possible Duplicate:
jQuery UI: How to use ui-widget-overlay by itself?

I want to avoid the user to change the screen during ajax calls. So I was thinking to use jQuery UI overlay (the overlay of the modal dialogs) but without any dialog. I couldn't find any way to do this.

Is there any way to show a modal without a dialog?

Answer 1

I take this answer of another SO question.

Here there is a fiddle.

And the code:

$("body").append($.ui.dialog.overlay.create())

Answer 2

The dialog with the modal option set to true adds the following div, where width and height represent the viewable area in the browser window:

<div class="ui-widget-overlay" style="width: 607px; height: 350px; z-index: 1001;"></div>

You could try something similar on your page. See http://jqueryui.com/dialog/#modal and then view source on the demo iframe for the complete source.

Answer 3

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.dialog.js

Their code shows that they call _createOverlay() and _destroyOverlay() on the widget. You could try creating a dialog and init it with autoOpen:false and then invoke those methods manually.