scrollTop

모크장·2022년 11월 22일

스크롤을 내려야 할 정도의 컨텐츠가 있을 때 가장 처음 부분부터 현재 화면의 끝까지의 길이가 scrollTop 요소이다.
화면에서 현재 스크롤의 위치를 알 수 있게 한다고 한다.

추가적인 element는 clientHeight와 scrolleright이 있다.
clientHeight
현재 화면에 보이는 값

scrollHeight
화면 밖 아래 끝까지의 값

무한 스크롤을 구현 할 땐
scrollTop + clientHeight == scrollHeight로 구현 가능하다.
여기에 scrollHeight에 - 5px 정도의 값을 주게 되면 현재의 scrollHeight과 추가로 뜨는 화면의 5px이 겹칠 때 무한 스크롤이 구현 되도록 할 수 있다.

사실 작성하면서도 아직 헷갈리는 부분이 많다...ㅠ
몇 번 더 작성을 해보면서 이해를 해야겠다.

profile
시작하는 개발자

0개의 댓글