jquery UI 배치 대화 상자

Question

본문 내부의 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')});