jQuery: разница между позицией () и смещением()


в чем разница между position() и offset()? Я попытался сделать следующее в событии щелчка:

console.info($(this).position(), $(this).offset());

и они, кажется, возвращаются точно так же... (Щелкнутый элемент находится в ячейке таблицы в таблице)

3 168

3 ответа:

Это зависит от контекста элемент. position возвращает позицию относительно смещения родителя и offset тут же относительно документа. Очевидно, что если документ является родителем смещения, что часто бывает, они будут идентичны.

однако, если у вас есть макет, как это:

 <div style="position: absolute; top: 200; left: 200;">
     <div id="sub"></div>
 </div>

тут offset на sub будет 200:200, но position будет 0:0.

на .offset () метод позволяет нам получить текущее положение элемента относительно документа. Сравните это с .позиция (), который получает текущее положение относительно смещенного родителя. При размещении нового элемента поверх существующего для глобальных манипуляций (в частности, для реализации перетаскивания), .смещение () является более полезным.

источник: http://api.jquery.com/offset/

обе функции возвращают обычный объект с двумя свойствами: ширина и высота.

смещение() относится к позиции относительно документа.

position () относится к позиции относительно ее родительского элемента

но когда позиция css объекта является "абсолютной", обе функции вернут width=0 & height=0