Jquery ui 在完整窗口中显示jQuery UI模式对话框

我想显示一个包含多个元素的模式对话框，包括一个iframe。我希望这个对话框占据窗口宽度和高度的90%。标记类似于以下内容：

<div id="dialog">
    <div>Header information</div>
    <iframe></iframe>
</div>

标题信息

---

我怎样才能做到这一点？当我使用jQuery UI对话框时，即使我通过对话框选项或类指定了宽度和高度，它们也会被jQuery UI指定给元素的内联样式覆盖。

我通过确定窗口尺寸，然后相应地设置对话框宽度和iframe高度来实现这一点。下面的代码可能不是最好的，但它可以工作，并且可以很容易地修改，使宽度和高度小于窗口的百分比

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
});