javascript - 如何使 jQuery UI 对话框占据整个窗口并动态调整以适应窗口大小的变化？

Question

目前，我可以将 width 属性设置为 auto 以获取窗口的整个宽度，如果窗口大小发生变化，它会自行动态调整(例如，重新调整浏览器窗口的大小或将其显示在不同的屏幕尺寸上)。示例:http://jsfiddle.net/NnsN2/

但是，我无法让 height 正常工作。它始终是适合内容的最小高度，即使我已尝试将其设置为 auto。

首先获取窗口高度 ($(window).height()) 并将其用于 height 的通常方法在这里不起作用，因为它会是静态的，不会动态适应窗口大小的变化。

如何使高度始终占据窗口的整个高度，并能够适应窗口大小的变化？

Answer 1

可以尝试在运行时获取元素的#id或.class，然后根据窗口的宽高来设置width/Height:

$(window).resize(function () {
   $('.ui-dialog').css({
        'width': $(window).width(),
        'height': $(window).height(),
        'left': '0px',
        'top':'0px'
   });
}).resize(); //<---- resizes on page ready

checkout in fiddle