Animate scrollTop on scroll event

Question

I have a custom slider. And I want to do a such thing. When user scrolls down it should animate scroll down to next slide, and during this animation user should not be able to scroll. But I have a problem. Scroll event is fired multiple times, and after one animation is done, second one is started, and etc.

Here is my code sample

$(window).scroll(function(e){
  if($scrolling){
    e.preventDefault();
    e.stopPropagation();
  }
})

$(window).on('mousewheel', function(event){
    $scrolling = true
    $('html, body').animate({scrollTop: 'my position here' }, {done: function(){ $scrolling = false; } }, 1000)
});

What I am doing wrong? Thanks in advance!

Answer 1

You can control everything from the mousewheel event alone..

var $scrolling = false;
$(window).on('mousewheel', function(event){
  if (!$scrolling){
    $scrolling = true;
    $('html, body').animate({scrollTop: 'my position here' }, {done: function(){ $scrolling = false; } }, 1000);
  }
});