将两个JQuery UI对话框放在一起

我可以添加一个没有任何问题的JQuery UI Dialog。 我想要做的是添加两个JQuery UI对话框，一个在另一个上面，屏幕中心“切割”两个对话框，使它们在屏幕上垂直居中。

如果我添加：

if(i > 0) { $("#dialog" + i).dialog("option", "position", {my: "top", at: "bottom", of: $("#dialog" + (i-1))}); } 

然后第一个对话框将以其下的第二个对话框为中心。 有没有办法将第一个对话框的高度设置为高一半？

Answer 1

您可以使用open事件来调整位置：

 $('#dialog1, #dialog2').dialog({ open: function() { var $this = $(this), $parent = $this.parent(), halfWidth = $parent.outerWidth() / 2, parentLeft = $parent.position().left; parentLeft += $this.is('#dialog1') ? (0 - halfWidth) : halfWidth; $parent.css({left: parentLeft}); } }); 

您尝试的方法是寻找尚不存在的定位尺寸

DEMO