jQuery: разница между $ (document) .scrollLeft() и предыдущим значением $ (document) .scrollLeft() в $ (document) .scroll (...) event

Question

Я пытаюсь рассчитать, насколько далеко пользователь прокручивается вправо/влево, в событии $ (document) .scroll (..).

$(function() { 

    $(document).scroll(function() { 

     console.log($(document).scrollLeft()); 

     console.log('=========='); 

    }); 

}); 

Вы можете увидеть скрипку здесь: https://jsfiddle.net/5twd82bo/

В принципе, я хочу, чтобы вычислить разницу между 2 последних значений в консоли вывода, так как пользователь прокручивает.

Любая помощь будет оценена!

Thanks

Answer 1

В основном, что вы ищете, это событие с прокруткой.

Вы можете создать новое событие остановки прокрутки, применив функцию setTimeout с событием прокрутки.

$(function() { 
 
$.fn.scrollStopped = function(callback) { 
 
    var that = this, $this = $(that); 
 
    $this.scroll(function(ev) { 
 
    clearTimeout($this.data('scrollTimeout')); 
 
    $this.data('scrollTimeout', setTimeout(callback.bind(that), 250, ev)); 
 
    }); 
 
}; 
 
    
 
    var prevVal=0; 
 
    
 
    $(document).scrollStopped(function() { 
 
    
 
    \t console.log(prevVal - $(document).scrollLeft()); 
 
    prevVal = $(document).scrollLeft(); 
 
    \t //console.log($(document).scrollLeft()); 
 
    
 
    //console.log('=========='); 
 
    
 
    }); 
 
    
 
});

div { 
 
    width:5000px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
hello 
 
</div>

Upvote, если помогает.