定位jquery ui對話框

Question

如何相對於body內的div元素定位jquery ui對話框？

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]});
});

這是演示的鏈接。

jQuery offset （）返回相對於document的元素postion，而position （）返回相對於offset的父元素。

Answer 2

使用jQuery位置函數或jQuery UI

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

Answer 3

http://api.jquery.com/offset/顯示了如何獲取div元素的坐標。 但直接使用可能還不夠，因為這取決於布局結構（浮點數，邊距等）。