[Javascript] 웹페이지에서 스크롤시 아래쪽(끝)에서 스크롤 기능이 안먹힐때

스크롤을 끝까지 내려서, 끝에 도달하면 데이터를 불러와 추가하는 방식으로 정보를 노출할 수 있다. (더보기 기능)

잘되던 로직인데… 휴대폰이 발달(?)하면서 이 기능이 제대로 되지않고 있어 원인 분석을 하였다.

$(document).ready(function(){
        $(window).scroll(function() {
               if ($(window).scrollTop() == $(document).height() – $(window).height()) {
                   ajaxCall();
                }
        });
});

로그를 찍어보니, 스마트 폰에서 $(window).scrollTop() 값이 정수가 아닌 소숫점 단위로 떨어지고 있었다.

브라우저에서는 정상이다. 그래서 소숫점 자리 값을 버렸다.

$(document).ready(function() 
{ 
        $(window).scroll(function() { 
               if (Math.floor($(window).scrollTop()) == $(document).height() – $(window).height()) {
                   ajaxCall();
                } 
        }); 
});
최신 스마트 폰에서도 제대로 동작한다

var scroll = $(window).scrollTop(); //스크롤의 현재 위치 
var documentHeight = $(document).height() //웹페이지 높이값으로 고정값이다. 
var windowHeight = $(window).height() //윈도우창 높이(모니터, 스마트폰 해상도에 따라 길이가 달라진다.)