J.BF Story
[Javascript] 스크롤 처음과 끝 탐지 본문
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) 처리를 하였다.
'FrontEnd > Javascript' 카테고리의 다른 글
[Javascript] 탭(Tab) 구현하기 (0) | 2022.07.19 |
---|---|
[Javascript] onclick vs addEventListener("click") (0) | 2022.07.17 |
[Javascript] 값 체크 함수 모음 (커스텀) (0) | 2022.06.21 |
[Javascript] LocalStorage (0) | 2022.06.19 |
[Javascript] Factory Pattern vs Constructor Function vs Class (0) | 2022.06.08 |