728x90
반응형
스크롤이 맨아래 내려왔는지 감지 하는 이벤트
스크롤이 맨아래 내려왔을때 웹의 경우는 페이징이 표시되고,
모바일인 경우 스크롤을 내려 아래 목록이 더 조회되도록 구현
var tmpPage = "1";
$(".item-list.scroll-area").scroll(function() {
var scrollTop = $(this).scrollTop();
var innerHeight = $(this).innerHeight();
if (isMobile()){
if (scrollTop + innerHeight >= $(this)[0].scrollHeight) {
tmpPage++;
getList(tmpPage);
}
}
});
var tmpPage = "1";
$(".item-list.scroll-area").scroll(function() {
// 현재 영역의 가장 위
var scrollTop = $(this).scrollTop();
// 현재 보이는 영역의 높이(스크롤로 감춰진곳은 계산 X)
var innerHeight = $(this).innerHeight();
// 스크롤 포함 영역의 높이(스크롤로 감춰진곳 계산 O)
var scrollHeight = $(this).prop('scrollHeight');
if (isMobile()){
// 스크롤 맨 아래 일때
if (scrollTop + innerHeight >= scrollHeight) {
tmpPage++;
getList(tmpPage);
}
}
});
728x90
반응형
'개발 > WEB' 카테고리의 다른 글
[저장용]chartjs 가로 누적 차트 그리기 (0) | 2023.11.13 |
---|---|
이클립스에서 PMD 사용하기(전자정부 룰셋 적용) 씨큐어코딩(Secure Coding) (0) | 2023.01.05 |
[저장용] a 태그 마우스 오버시 URL 안보이도록 변경 (0) | 2022.11.29 |
Syntax Error / 구문 오류 (unrecognized expression: #;) (0) | 2021.06.22 |
댓글