Question

how to set background images when jquery dialog ui is open()

how can i set background images of html page in jquery

Answer 1

The jQuery UI Dialog won’t prevent you from altering the page behind it with javascript, even if the dialog is modal.

The following will work:

$('body').css('background','url(path/to/your/image.jpg)')

If you want to set that background image when your UI Dialog opens, then you would bind to the dialog’s “open” event, like so:

$( ".selector" ).dialog({
   open: function(event, ui) { ... }
});

or…

$( ".selector" ).bind( "dialogopen", function(event, ui) {
  ...
});

If you’re experiencing trouble setting a new background image on the page, it may be that there’s an element being styled on your page with a more specific CSS selector than you’re providing. For instance, you may have a wrapper div nested just inside the body that has a background image, which would knock out the body tag’s.