定位jQuery UI对话框

Question

如何定位jQuery UI对话框相对于身体内的div元素？

Answer 1

也许，这可能让你的想法如何做到这一点：

HTML：

<div id="one" class="divs"></div> 
<div id="two" class="divs"></div> 

CSS：

.divs { 
    float: left; 
    height: 48px; 
    width: 80px; 
    border: 1px solid #55f; 
} 

JS：

$(document).ready(function(){ 
    var $div = $('#two'); 
    var left = $div.offset().left; 
    var top= $div.offset().top; 
    $('<p>Some dialog</p>').dialog({position: [left + 20, top + 20]}); 
}); 

这是链接到demo。

jQuery offset（）返回相对于文档的元素位置，而position（）返回相对于偏移父项。

Answer 2

http://api.jquery.com/offset/显示如何获取div元素的坐标。但直接使用可能还不够，因为这取决于布局结构（浮动，边距等）。

Answer 3

使用jQuery position function或jQuery UI one

$('#dialog').position({of: $('#your_div')});