Позиционирование 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

Использование Функция положения jQuery или jQuery UI one

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

Answer 3

http://api.jquery.com/offset/ показывает, как получить координаты элемента div. но прямого использования может быть недостаточно, поскольку это зависит от структуры макета (плавающие поля, поля и т. д.).