jquery uiダイアログの配置

Question

body内のdiv要素に関してjquery UIダイアログボックスを配置する方法はありますか？

Answer 1

jQuery UI oneおそらくこれはそれを行う方法をあなたのアイデアを得る可能性があります：

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または

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