1

我有以下 jQuery popUp 对话框的初始化,带有动态内容:

  jQuery("#popUp").live("click", function (e) {
   e.preventDefault();
    jQuery("<div></div>")
        .addClass("dialog")
        .attr("id", "popUpDialog")
        .appendTo("body")
        .dialog({
            title: jQuery(this).attr("data-dialog-title"),
            close: function() { jQuery(this).remove(); },
            modal: true,
            hide: { effect: "none", duration: 150 },
            show: { effect: "none", duration: 150 },
            width: 'auto',
            height: 'auto',
            position: {
                my: 'center',
                at: 'center',
            of: jQuery(window)
            }
        }).load(this.href);

    jQuery(".close").live("click", function (e) {
        e.preventDefault();
        jQuery(this).closest(".dialog").dialog("close");
    });
});

});

对于这个最简单的问题,我很抱歉,但我不能将弹出窗口放在整个页面的中心。问题出在:

                  position: {
                  my: 'center',
                  at: 'center',
              of: jQuery(window)}
4

2 回答 2

4

问题是因为对话框在其内容加载之前被定位,因此它的大小正在改变。更改您的逻辑,以便首先加载内容,然后实例化对话框:

$('<div />', {
  class: 'dialog',
  id: 'popUpDialog' 
}).appendTo('body').load(this.href, function() {
  // set up the dialog in the callback of the AJAX request...
  $(this).dialog({
    title: jQuery(this).attr("data-dialog-title"),
    close: function() { jQuery(this).remove(); },
    modal: true,
    hide: { effect: "none", duration: 150 },
    show: { effect: "none", duration: 150 },
    width: 'auto',
    height: 'auto',
    position: {
      my: 'center',
      at: 'center',
      of: window
    }
  })
});
于 2013-10-10T12:26:01.110 回答
0

这对于位置选项应该足够了:

position:'center'

行得通吗?

于 2013-10-10T12:25:07.587 回答