Eu preciso que quando o usuário role o scroll do mouse para cima ou para baixo, seja acionada uma função específica apenas uma única vez...
Estou utilizando o seguinte código mas não está atendendo a minha necessidade:
var stopScroll = false;
$(window).scroll(function (event) {
var scrollAtual = $(this).scrollTop();
if (scrollAtual > lastScrollTop) {
// down scroll code
if(stopScroll == false){
console.log('scroll para baixo');
stopScroll = true;
//depois de 1 segundo ativa a função do scroll down novamente
setTimeout(function(){
stopScroll = false;
}, 1100);
}
} else {
// up scroll code
if(stopScroll == false){
console.log('scroll para cima');
stopScroll = true;
//depois de 1 segundo ativa a função do scroll up novamente
setTimeout(function(){
stopScroll = false;
}, 1100);
}
}
lastScrollTop = scrollAtual;
});
Quando eu rolo o scroll para cima ou para baixo, ele chama a função "console.log()" inúmeras vezes...preciso que chame apenas 1x e volte a chamar após 1 segundo.
** Eu sei ou meu erro mais ou menos, no começo do código eu declaro a variavel stopScroll como false, e dentro do "$(window).scroll(function (event)" eu mudo seu valor para true para que ocorra uma parada, mas cada vez que eu rolar o scroll a variavel stopScroll voltará a ser false pois irá pegar o valor global.
Preciso de ajuda para arrumar essa lógica, e resolver o meu problema. Se houver uma maneira mais fácil de fazer isso, gostaria de uma sugestão.