window.outerHeight 질문

Question

화면의 크기만큼 빼줘야 하기때문에 window.outerHeight 를 사용하였는데.. window.innerHeight 가 아닌 outerHeight 사용한 이유가 있을까요? 그리고 영상처럼 Math.ceil(scrollTop / (document.body.scrollHeight - window.outerHeight) * 100) 으로 적용하고 콘솔로 찍히게 했는데 스크롤을 최하단으로 내렸을 때 100이 아닌 101, 102 이렇게 숫자가 보여집니다 딱 100으로 맞출 순 없는 건가요?

코딩일레븐 · Answer

안녕하세요. 영상 하단에 수정을 해서 넣었습니다. 영상 캡쳐 당시에는 다른 요소가 없다보니 못 느꼈는데, 오차가 심해졌네요. 정확하게 0~100이 나오는 코드는 Math. round (scrollTop / (document.body.scrollHeight - window. innerHeight ) * 100) 위 처럼 해보시면 됩니다. ceil 은 올림 -> round 반올림으로 바꿔주시고 window내부 사이즈를 가져오는 innerHeight 로 가져오시면 됩니다.  - 영상 편집을 하던가 하단 설명글에 크게 강조를 해야겠네요. 즐거운 하루 보내세요.

코딩일레븐 · Answer

위에 작성해드린 코드와 같이 innerHeight 로 빼주시는 게 더 정확합니다. body{ height : 3000px;  } 이렇게 해보시고 0~100까지 잘 나오는지 테스트해보세요.

이은혜 · Answer

화면의 크기만큼 빼주어야 할 때, outerHeight 또는 innerHeight ..  둘 중 아무거나 쓰면 되는 건가요??