将对话框放在窗口的右侧

Question

我喜欢在单击链接时创建一个对话框，如下例所示。它工作到目前为止，但对话框始终显示在中心窗口。我喜欢改变它并将它定位在窗口的右侧。我有什么想法可以解决这个问题吗？

<script type="text/javascript"> 

          $(function() {
          $("#lin").click(function(){
            $( "#dialog" ).dialog();
           });
      });
});

HTML：

<li><a id="lin" href="#">link</a></li>

    <div id="dialog" class="def" title="title" style="display:none;">
       <p>thi is the text in the dialog</p>
    </div>

Answer 1

jquery ui docs指定您可以添加的位置属性，以便将其定位：

1. 表示视口内位置的单个字符串：'center'，'left'，'right'，'top'，'bottom'。
2. 一个数组，包含一个x，y坐标对，偏离左边，视口顶角（例如[350,100]）

3. 包含x，y位置字符串值的数组（例如右上角的['right'，'top']）。

   $( "#dialog" ).dialog({position:'right'});

Answer 2

使用position:选项：

position: { my: "right", at: "right", of: window }

Answer 3

有时阅读jquery UI doc会有所帮助：

$( "#dialog" ).dialog({position:'right'});