Question

How do I make a JQuery dialog size to the size of the window?

I tried using 'auto' but that just makes it size to its elements, and I don't want to specifiy the px's exactly b/c that won't be dynamic. thanks!

Was it helpful?

Solution

I'm taking a little bit of a guess here, but you can get the size of the window using:

var windowWidth = $(window).width();
var windowHeight = $(window).height();

So, I would take that, and pass that value to the jQuery Dialog.

$( ".dialog" ).dialog({ height: windowHeight, width: windowWidth });

OTHER TIPS

var dlg = $("#dialog"); // Get the dialog container. // Get the window dimensions. var width = $(window).width(); var height = $(window).height();

    // Provide some space between the window edges.
    width = width - 50;
    height = height - 150; // iframe height will need to be even less to account for space taken up by dialog title bar, buttons, etc.

    // Set the iframe height.
    $(dlg.children("iframe").get(0)).css("height", height + "px");

    dlg.dialog({
        modal: true,
        height: "auto", // Set the height to auto so that it grows along with the iframe.
        width: width
    });
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top