마지막에 저장된 방향 과 스크롤 중인 방향을 비교하여 위, 아래 스크롤 시 한번만 실행하게 하시면 됩니다.
아래 예제는 위, 아래 방향이 바뀔때마다 runAction() 함수가 한번만 실행됩니다.
function runAction(direction) {
console.log(direction+' 실행 !!!!');
}
var currentDirection = ''; // 현재의 방향을 나타내는 변수
var lastScrollTop = 0; // 방향을 구하기 위해 사용되는 변수
$(window).scroll(function(event){
var currentPos = $(this).scrollTop();
if (currentPos > lastScrollTop){
// 아래로 스크롤 중
if(currentDirection != 'down') { // 마지막 방향 확인
currentDirection = 'down';
runAction('down');
}
} else {
// 위로 스크롤 중
if(currentDirection != 'up') { // 마지막 방향 확인
currentDirection = 'up';
runAction('up');
}
}
lastScrollTop = currentPos; // 방향을 구하기 위해 마지막 스크롤 지점을 저장
});
특정 지점을 지날 때만 실행하고자 하시면
위 함수의 if(currentDirection! = 'down') 조건이나 if(currentDirection! = 'up') 조건을 원하시는 조건으로 변경하시면 됩니다.
...
// 스크롤이 페이지 바닥 근처에 올 경우 실행
if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
...
현재의 스크롤 방향을 변수에 저장해 놓고
마지막에 저장된 방향 과 스크롤 중인 방향을 비교하여 위, 아래 스크롤 시 한번만 실행하게 하시면 됩니다.
아래 예제는 위, 아래 방향이 바뀔때마다 runAction() 함수가 한번만 실행됩니다.
특정 지점을 지날 때만 실행하고자 하시면
위 함수의 if(currentDirection! = 'down') 조건이나 if(currentDirection! = 'up') 조건을 원하시는 조건으로 변경하시면 됩니다.