jqueryui对话框定位

Question

我正在使用JQuery UI,并希望将对话框水平居中但垂直位于中心上方,可能是固定数量的像素或距离页面顶部的相对距离.是否有捷径可寻？看起来只有几个预先定义的值,或者我可以使用一个确切的位置,但有一个简单的方法来实现这一点吗？

 $("#dialog-form").dialog({
                autoOpen: false,
                width: 630,
                position: 'center',
                modal: true,
                resizable: false,
                closeOnEscape: false

            });

Answer 1

使用position选项将对话框的顶部与窗口的顶部对齐(加上像素或百分比偏移).

这应该使对话框水平居中,并将其放置在距离顶部150像素的位置.

$("#dialog-form").dialog({
    autoOpen: false,
    width: 630,
    position: { my: 'top', at: 'top+150' },
    modal: true,
    resizable: false,
    closeOnEscape: false
});

较旧版本的jQuery UI使用了一个数组,其中包含一个[x,y]坐标对,在视口左上角的像素偏移中(例如[350,100]).

var dialogWidth = 630;
$("#dialog-form").dialog({
    // ...
    width: dialogWidth,
    position: [($(window).width() / 2) - (dialogWidth / 2), 150],
    // ...
});