좌표의 기준

자바스크립트에서 좌표의 기준은 page와 client로 구분됩니다.

page는 전체 문서 맨 위쪽 상단 모서리를 기준으로 좌표를 계산하고, client는 현재 보이는 문서의 맨 위쪽 상단 모서리를 기준으로 계산합니다.

• pageY = clientY + 문서에서 세로 방향 스크롤에 의해 밀려난 부분의 높이
• pageX = clientX + 문서에서 가로 방향 스크롤에 의해 밀려난 부분의 너비

getBoundingClientRect

getBoundingClientRect 메서드로 요소의 page 기준 좌표를 얻을 수 있습니다.

elementFromPoint(x, y)

document.elementFromPoint(x, y)을 호출하면 page 기준 좌표 (x, y)에서 가장 가까운 중첩 요소를 반합니다.

References

https://ko.javascript.info/coordinates