Positionierung des Dialogfelds "jquery ui"

Question

Wie positioniert man das Dialogfeld jquery ui in Bezug auf ein div-Element im Körper?

Answer 1

Vielleicht könnte man auf die Idee kommen, wie es geht:

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

Hier ist der Link zu demo.

jQuery offset() gibt die Elementposition relativ zum Dokument zurück, während position() relativ zum übergeordneten Offset zurückgibt.

Answer 2

http://api.jquery.com/offset/ zeigt, wie Koordinaten eines div-Elements erhalten werden. Die direkte Verwendung ist jedoch möglicherweise nicht ausreichend, da dies von der Layoutstruktur (Floats, Ränder usw.) abhängt.

Answer 3

Verwenden jQuery position function oder jQuery UI one

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