jQuery получить положение элемента относительно другого элемента

Question

jQuery получить положение элемента относительно другого элемента

Так что у меня есть div, как:

<div class="uiGrid">



<div class="trigger"></div>



</div>

и я хочу знать положение триггера для uiGrid и попробовал оба эти:

$('.trigger').offset('.uiGrid');



$('.trigger').position('.uiGrid');

но не понимаю. Смещение относится к документу, а позиция - к родительскому элементу, а не к указанному элементу.

Как бы я это сделал?
Спасибо

328 4

jQuery

4 ответов:

Comments

Ничего не найдено.

Ya Zhuang · Accepted Answer · 2013-05-24 12:02:37

просто сделать вычитание себя...

var relativeY = $("elementA").offset().top - $("elementB").offset().top;

Prabath Rathnayake · Accepted Answer · 2017-07-05 08:36:38

что вы можете сделать здесь в основном, вычесть значение родительского свойства из значения дочернего свойства.
var x = $('child-div').offset().top - $('parent-div').offset().top;

Jorden van Foreest · Accepted Answer · 2011-12-01 16:26:16

вы упускаете суть здесь....

кроме того, попробуйте:
myPosY = $('.trigger').offset().left - $('.uiGrid').offset().left;
myPosX = $('.trigger').offset().top - $('.uiGrid').offset().top;

A. Morel · Accepted Answer · 2018-04-26 21:54:18

проблема для меня заключалась в том, что я был в div с полосой прокрутки и что я должен был учитывать скрытую часть вплоть до корневого элемента.

Если я использую ".offset () " он дал мне неправильные значения, потому что он не учитывает скрытую часть полосы прокрутки, поскольку она относится к документу.

однако, я понял, что ".offsetTop" собственность по отношению к своей первой позиционируется родителя (offsetParent) всегда был корректен. Поэтому я сделал петлю чтобы рекурсивно перейти к корневому элементу путем добавления значений ".offsetTop":

Я сделал свою собственную функцию jquery для этого:
jQuery.fn.getOffsetTopFromRootParent = function () {
    let elem = this[0];
    let offset = 0;
    while (elem.offsetParent != null) {
        offset += elem.offsetTop;
        elem = $(elem.offsetParent)[0];
        if (elem.offsetParent === null) {
            offset += elem.offsetTop;
        }
    }
    return offset;
};
Вы можете использовать то же самое с ".offsetLeft" я полагаю...

Если вы хотите получить положение элемента относительно другого элемента, чтобы ответить на вопрос:
let fromElem = $("#fromElemID")[0];
let offset = 0;
while (fromElem.id.toUpperCase() != "toElemID".toUpperCase()) {
    offset += fromElem.offsetTop;
    fromElem = $(fromElem.offsetParent)[0];
}
return offset;
элемент (offsetParent) считается расположенным, если он имеет CSS атрибут положения относительного, абсолютного или зафиксированный.