The position method
The position method allows you to get the position of an element relative to the parent's margins, unlike the offset method, which gets coordinates relative to the document. The position method is more useful when positioning a new element next to another in the same parent. As a result, the method returns an object containing the top and left properties. Calculation errors may occur if the user changes the page size. The method also does not get coordinates of hidden elements.
Syntax
Get current coordinates. In some cases, the obtained values may be fractional:
$(selector).position();
Example
Let's get the position of a paragraph that is located in a div using the position method, and then, by accessing the keys of the resulting object, display this information in another paragraph:
<div style="padding: 15px;">
<p style="margin-left: 10px;">text</p>
</div>
<p></p>
let position = $('p').first().position();
$('p').last().text('left: ' + position.left + ', top: ' + position.top);
See also
-
method
offset,
which allows you to get the current coordinates of an element -
method
offsetParent,
which allows you to get the closest positioned ancestor of an element -
method
css,
which allows you to get and change the CSS styles of an element