水平居中jQuery对话框窗口

Question

我这里有一个例子。

当我打开窗口时，它是垂直居中的，但是水平中心却很低。 我想让它在弹出时居中显示在屏幕上。

这是脚本...

    $(function() {
        $("#dialog").dialog({
            autoOpen: false,
            modal: true,
            width: 1011,
            height: 'auto',
            show: 'fade',
            hide: 'fade',
            buttons: {
                "Dismiss": function() {
                    $(this).dialog("close");
                }
            }
        });

我试过使用position: 'middle', ，，但是没有用。

Answer 1

查看position http://api.jqueryui.com/dialog/#option-position的文档

使用方法如下：

$("#dialog").dialog({
    autoOpen: false,
    modal: true,
    width: 1011,
    height: 'auto',
    show: 'fade',
    hide: 'fade',
    position: {my: "center top", at:"center top", of: window },
    buttons: {
        "Dismiss": function() {
            $(this).dialog("close");
        }
    }
}); 

我通读了文档。 我希望对话框居中，在页面的中间...不居中，并且在最顶部。 就在页面中间。 我试过左中心，中心中心...为什么中间没有中心？ – webfrogs 2013年9月6日22:58

  Someone please come back... – webfrogs Sep 7 '13 at 2:04 

您可以使用以下任何一种方法在页面中间

$("#dialog").dialog({
    autoOpen: false,
    modal: true,
    width: 1011,
    height: 'auto',
    show: 'fade',
    hide: 'fade',
    position: {my: "center top", at:"center middle", of: window },
    buttons: {
        "Dismiss": function() {
            $(this).dialog("close");
        }
    }
}); 

要么

$("#dialog").dialog({
    autoOpen: false,
    modal: true,
    width: 1011,
    height: 'auto',
    show: 'fade',
    hide: 'fade',
    position: ['center', 'middle'],
    buttons: {
        "Dismiss": function() {
            $(this).dialog("close");
        }
    }
});