JSFiddle - React, Tailwind, and code Playground

get instance between element and top!

by Shah Danial

HTML

<div id="first">
first element. (not top) but most plg dekat ngan top kan
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div id="element">
eleeeeemmment
</div>

JavaScript

//window.addEventListener('scroll',function(){
          console.log(
          	getPosition(document.getElementById('element'))
          )
//});

function getPosition(element) {
    var xPosition = 0;
    var yPosition = 0;

    while(element) {
        xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
        yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
        element = element.offsetParent;
    }

    return { x: xPosition, y: yPosition };
}