웹에서 화면 스크롤에 관련된 값

스크롤 되는 위치를 구하려면 document.body.scrollTop을,
전체 문서의 길이를 구하려면 document.body.scrollHeight을 씁니다.
하지만 document.body.scrollTop을 써서 자동으로 스크롤 시킬 때에는 그 최대값이 전체 길이보다 짧게 나올 수 밖에 없는데, 이는 document.body.scrollTop가 현재 보여지는 창의 맨 윗 부분의 위치를 돌려주기 때문입니다. 아래를 보세요 :-)

#################
#################
################# 안 보이는 내용들
#################
#################
#################
@@@@@@@@@@@ <-- document.body.scrollTop
@@@@@@@@@@@
@@@@@@@@@@@ 실제로 보이는 부분
@@@@@@@@@@@ <-- document.body.scrollHeight

보시듯이 아무리 스크롤을 해도 document.body.scrollHeight와 document.body.scrollTop는 똑같아 지지 않습니다. :-(
따라서 document.body.scrollHeight에서 그 창의 크기를 빼야 하는데, 현재 보이는 창의 크기를 알아 내려면 document.body.clientHeight를 씁니다.

정리하면:
document.body.scrollTop에 집어 넣을 수 있는 값은
최소값: 0
최대값: document.body.scrollHeight - document.body.clientHeight

이라는 겁니다 :-)

- 토끼군

토끼군이라는 분이 쓴 글을 옮겼다.
어디서 보고 옮겼는지는 기억이 나지 않는다.
document라고 보이는 부분에서 - 표시는 빼야한다.
블로그 자체에서 붙인 정보이다.

추가

  layertable.style.left=document.body.scrollWidth/2-107
  layertable.style.top=document.body.scrollTop+document.body.clientHeight/2-layertable.offsetHeight/2

어떤 레이어를 화면 중앙에 표시하려고 할 때 위 소스를 사용하면 가능하다.