CODEWITHSUNDEEP
javascripthtmlcssdom
Adam M.
Adam M.

Reputation: 1088

How to calculate the distance between the top-left corner of an HTML element and the window top-left corner?

Is there an easily way to do that? Consider having properties like: border, padding. Would that method work even with box-sizing: content-box/border-box?

Upvotes: 0

Views: 1108

Answers (3)

Adam M.
Adam M.

Reputation: 1088

The function

element.getBoundingClientRect()

solves the problem.

More about it can be found here:

https://developer.mozilla.org/en-US/docs/Web/API/Element.getBoundingClientRect

Upvotes: 0

Pravin W
Pravin W

Reputation: 2521

DEMO

Perhaps you may be looking similar to position or offest in jquery can be simply achieved by using jQuery as follows

HTML

<div class="box">Lorem ipsum dores.</div>

jQuery

var $box = $('.box');
alert( $box.offset().top)

Hope this helps!

Upvotes: 0

Michael Voznesensky
Michael Voznesensky

Reputation: 1618

perhaps I do not understand your question, but

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.offsetLeft (Or same link except offsetLeft, I can't post more then 2 links yet :P)

https://developer.mozilla.org/en-US/docs/Web/API/Element.getBoundingClientRect

Let me know if those links don't solve it!

Upvotes: 1

Related Questions