JavaScript에서 스크롤바 위치를 어떻게 결정합니까?

JavaScript로 스크롤바 위치 결정

웹페이지를 탐색할 때 현재 보기를 이해하기 위해 스크롤바의 위치를 ​​결정해야 하는 경우가 많습니다. . 초기 직감과는 달리 JavaScript는 썸 및 트랙 크기를 계산할 필요 없이 간단한 솔루션을 제공합니다.

해결책:

JavaScript는 요소에 대해 scrollTop 및 scrollLeft 속성을 제공합니다. 전체 페이지를 나타내는 document.body와 같은 것입니다. 이러한 속성은 각각 세로 및 가로 스크롤 위치를 제공합니다.

스크롤 막대의 오프셋 비율을 얻으려면 스크롤 위치를 요소의 전체 높이 또는 너비와 비교할 수 있습니다. 페이지의 경우 document.body.offsetHeight 및 document.body.offsetWidth를 적절하게 사용하세요.

코드 예:

// Get the scrollbar position from the body
var scrollTop = document.body.scrollTop;
var scrollLeft = document.body.scrollLeft;

// Calculate the percentage offset of the scrollbar
var percentScrollTop = scrollTop / (document.body.scrollHeight - document.body.offsetHeight);
var percentscrollLeft = scrollLeft / (document.body.scrollWidth - document.body.offsetWidth);

scrollTop 및 scrollLeft를 활용하면 다음을 수행할 수 있습니다. 현재 스크롤바 위치와 해당 백분율 오프셋을 손쉽게 결정하여 페이지 스크롤과 웹 애플리케이션의 상호 작용을 향상시키는 것이 편리합니다.

위 내용은 JavaScript에서 스크롤바 위치를 어떻게 결정합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!