[JavaScript] scroll, offset property 정리

nemo·2022년 1월 9일
0

JavaScript

목록 보기
3/23

자주 헷갈리는 scroll, offset 프로퍼티에 대해 정리하고자 한다. 😅


scrollTop/Right/Bottom/Left

현재 스크롤 위치 값

scrollTop

아래로 스크롤 되어서 안 보이는 요소의 위쪽 높이

scrollRight

왼쪽으로 스크롤 되어서 안 보이는 요소의 오른쪽 너비

scrollBottom

위로 스크롤 되어서 안 보이는 요소의 아래쪽 높이

scrollLeft

오른쪽으로 스크롤 되어서 안 보이는 요소의 왼쪽 너비



scrollWidth/Height

scrollWidth

스크롤해야 보이는 영역까지 포함한 요소의 전체 너비

scrollHeight

스크롤해야 보이는 영역까지 포함한 요소의 전체 높이




offsetTop/Right/Bottom/Left

요소의 위치 값

offSetTop

위쪽으로부터 요소의 위치 값

offSetRight

오른쪽으로부터 요소의 위치 값

offSetBottom

아래로부터 요소의 위치 값

offSetLeft

왼쪽으로부터 요소의 위치 값



offsetWidth/Height

offsetWidth

border까지 포함된 요소의 너비

offsetHeight

border까지 포함된 요소의 높이


0개의 댓글