사용자가 웹페이지 하단으로 스크롤한 경우를 어떻게 감지할 수 있나요?

웹 페이지에서 사용자 스크롤 위치 식별

사용자가 웹 페이지 하단으로 스크롤했는지 확인하는 것은 특정 작업을 실행하는 데 필수적입니다. , 페이지 자동 업데이트 등. 이 감지를 수행하는 방법은 다음과 같습니다.

시작하려면 창 개체에 스크롤 이벤트 리스너를 등록해야 합니다.

window.onscroll = function(ev) {

이 이벤트 핸들러 내에서 현재 스크롤을 계산할 수 있습니다. 위치를 지정하고 이를 웹페이지의 높이와 비교합니다.

if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {

• window.innerHeight: 보이는 높이를 나타냅니다. 브라우저 창의
• window.scrollY: 웹페이지 내의 세로 스크롤 위치를 나타냅니다.
• document.body.offsetHeight: 스크롤된 높이와 스크롤되지 않은 높이를 포함한 웹페이지 콘텐츠의 전체 높이를 제공합니다. 스크롤된 영역.

window.innerHeight와 window.scrollY의 합이 다음보다 큰 경우 document.body.offsetHeight와 동일하며 이는 사용자가 페이지 하단에 도달하여 수행해야 하는 작업을 트리거했음을 의미합니다.

구현 예

의 경우 예를 들어 웹페이지 하단에 도달하면 새 콘텐츠로 업데이트하려면 다음 코드를 사용할 수 있습니다.

window.onscroll = function(ev) {
    if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {
        // Load or generate new content to add to the bottom of the page
    }
};

이 기술을 사용하면 사용자가 페이지 끝으로 스크롤했는지 여부를 효과적으로 확인하고 그에 따라 적절한 작업을 실행할 수 있습니다.

위 내용은 사용자가 웹페이지 하단으로 스크롤한 경우를 어떻게 감지할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!