J.BF Story

[Javascript] 스크롤 처음과 끝 탐지 본문

FrontEnd/Javascript

[Javascript] 스크롤 처음과 끝 탐지

J.BF 2022. 7. 15. 21:11

X축, Y축 스크롤에 대하여 처음과 끝을 탐지하는 코드는 다음과 같다.

//
// X축 scroll
function isScrollXStart(ele) {
    return (ele.scrollLeft <= 0);
}

function isScrollXEnd(ele) {
    return (Math.ceil(ele.scrollLeft + ele.offsetWidth) >= ele.scrollWidth)
}

//
// Y축 scroll

function isScrollYStart(ele) {
    return (ele.scrollTop <= 0);
}

function isScrollYEnd(ele) {
    return (Math.ceil(ele.scrollTop + ele.offsetHeight) >= ele.scrollHeight)
}

** ceil: Window환경의 브라우저에서 특정 해상도에서 1미만의 차이로 탐지를 못하는 경우가 있었다. 이를 방지하기위해 값을 올림(ceil) 처리를 하였다.

Comments