Question

I’m trying to create a loading dialog which will contain a loading spinner gif while some ajax calls are performed.

The thing is I haven’t figure out how to make the dialog to fit the exact width and height of the gif.

this is my code:

var $dialog_loading = $('<div id="loading_dialog" style="width: 48px; height: 48px;"></div>')
    .html('<img src="/Images/Boletos/loading.gif" alt="loading"/>')
    .dialog({
        autoOpen: false,
        autoResize: true,
        title: 'Loading...'
    });

loading.gif dimensions are: 48×48

I would also like to make the dialog not resizable at all… how can I do that?

Thank you!

Answer 1

Try this:

var $dialog_loading = $('<div id="loading_dialog" style="width: 48px;
height: 48px;"></div>')
    .html('<img src="/Images/Boletos/loading.gif" alt="loading"/>')
    .dialog({
        autoOpen: false,
        title: 'Loading...',
        width: 48,
        height: 48,
        resizable: false
    });