znaleźć element względny z jQuery

Question

Czy istnieje prosty i czysty sposób jquery, aby znaleźć element, do którego element ma względną pozycję? Innymi słowy: znalezienie pierwszego elementu nadrzędnego, który ma atrybut css position: relative, lub elementu body (jeśli żaden element nadrzędny nie ma wartości position: relative).

Nie wiem, css-klasy lub cokolwiek z rodzica.

Answer 1

Począwszy elementu załadowana w $elem

var $closestRelativeParent = $elem.parents().filter(function() { 
    // reduce to only relative position or "body" elements 
    var $this = $(this); 
    return $this.is('body') || $this.css('position') == 'relative'; 
}).slice(0,1); // grab only the "first" 

Answer 2

Zakładam, że tylko chcesz wiedzieć, to w celu obliczenia położenia dziecka od jego pierwszy względny rodzicem. Sugerowałbym, że lepszym rozwiązaniem byłoby po prostu użycie obliczeń jQuery: .offsetParent(), które będą również szukać rodziców pozycji fixed i absolute, ponieważ będą one miały podobny wpływ na pozycję dziecka.

To powiedziawszy, oto krótki makiety, jak można iść na temat korzystania .offsetParent() obliczyć to względne położenie (see JSFiddle):

// Given a target, find it's first offset parent, and work out the targets position 
// relative to the parent, by deducting their respective .offset() values 
var $target = $("#bar"), 
    $offsetParent = $target.offsetParent(), 
    oTarget = $target.offset(), 
    oParent = $offsetParent.offset(), 
    posTop = oTarget.top - oParent.top, 
    posLeft = oTarget.left - oParent.left; 

// Validate this works by cloning #bar and positioning the clone directly on top 
// Result should be a blue "bar" rather than a "red" one. 
$target.clone().appendTo($offsetParent).attr("id", "confirm").css({ 
    top: posTop, 
    left: posLeft 
});