Question

我需要在点击超链接时显示对话框。如果页面中有10条记录，则对话框显示正确。但是如果我们在点击第50条记录时有50条记录，则弹出位置不好，看到popup我需要scrool。请让我知道如何在点击网格中的任何地方时准确显示弹出位置，在那个地方我只需要显示弹出窗口。无需向下滚动即可查看弹出窗口。

我的css：

 dlg = dlgdiv.dialog({
                title: 'Details: ' + title,
                height: 650,
                width: 450,
                modal: true,
                resizable: true,
                draggable: true,
                autoOpen: false,        
                position: [400, 50]
            });

Answer 1

您可以尝试以下代码..

dlg = dlgdiv.dialog({
            title: 'Details: ' + title,
            height: 650,
            width: 450,
            margin-left: -225,
            margin-top: -325,
            left: $(document).width() / 2,
            top: $(document).height() / 2,
            modal: true,
            resizable: true,
            draggable: true,
            autoOpen: false,
            position: fixed
        });

祝你好运..

Answer 2

您可以使用jquery position component。

$("#myDialog").position({
   my: "center",
   at: "center",
   of: window
});

请参阅Jquery Documentaion for Position

Answer 3

你必须将窗口分成两个相等的部分，然后减去对话框宽度的一半，使其完全居中于页面上，如下图所示：

+--------|--------+
|        |        |
|    +===|===+    | 
|    |   |   |    | 
-------------------
|    |   |   |    | 
|    +===|===+    |
|        |        |
+--------|--------+

所以你的代码应该是这样的：

dlg = dlgdiv.dialog({
      title: 'Details: ' + title,
      height: 650,
      width: 450,
      margin-left: -225,
      margin-top: -325,
      left: $(document).width() / 2 - $(this).width() / 2,
      top: $(document).height() / 2 - $(this).height() / 2,
      modal: true,
      resizable: true,
      draggable: true,
      autoOpen: false,
      position: fixed
 });

如何在屏幕中间正确显示对话css？

3 个答案: