Перелистывает сразу по два-три блока

Лендинг с 4-я блоками. Хочу что бы листать можно было только по одному, без разницы сколько прокрутишь мишкой. В данный момент перелистывает 1-2-3. подскажите как исправить..

var __cancel = {
  cancel: function() {}
};
var se1 = wrap(1, function() {
  $('.hr1')[0].click();
  $('#body').removeClass('black_line');
  //$( "#indiv" ).slider( "value", 170 );
});
var se2 = wrap(2, function() {
  $('#body').removeClass('black_line');
  $('.hr2')[0].click();
  //$( "#indiv" ).slider( "value", 120 );
});
var se3 = wrap(3, function() {
  $('#body').removeClass('black_line');
  $('.hr3')[0].click();
  //$( "#indiv" ).slider( "value", 70 );
});
var se4 = wrap(4, function() {
  $('#body').addClass('black_line');
  $('.hr4')[0].click();
  //$( "#indiv" ).slider( "value", 20 );
  //  $('#body').animate({scrollTop:  $('#inner').height()}, 500, 'swing' );
});

(function() {
  var ignore;
  var stateIndex = 0;
  var states = [se1, se2, se3, se4];
  var _throttle = delayOne(function(e) {
    var _stateIndex = stateIndex + (e.originalEvent.deltaY > 0 ? 1 : -1);
    var state = states[_stateIndex];
    if (!state) return;
    stateIndex = _stateIndex;
    state();
  }, 50);
  $('#inner').on('wheel mousewheel', function(e) {
    e.preventDefault();
    _throttle(e);
    return true;
  });
})();
function wrap(id, fn) {
  return function() {
    if (__cancel.id === id) return;
    __cancel.id = id;
    fn();
  };
}
function throttle(fn, delay) {
  var hasDebounce, result, self, args, hasCalled;
  function exec() {
    let _hasCalled = hasCalled;
    hasCalled = hasDebounce = false;
    if (_hasCalled) result = fn.apply(self, args);
  }
  return function() {
    if (hasDebounce) {
      self = this;
      args = arguments;
      hasCalled = true;
      return result;
    }
    hasDebounce = true;
    setTimeout(exec, delay);
    return result = fn.apply(this, arguments);
  };
};
function noop() {}
function one(fn) {
  var _cancel = noop;
  var instance = function() {
    _cancel();
    _cancel = fn.apply(this, arguments);
    return cancel;
  };
  var cancel = instance.cnacel = () => _cancel();
  return instance;
}
function delay(fn, delay, args, ctx) {
  setTimeout(function() {
    fn && fn.apply(ctx, args || []);
  }, delay);
  return function() {
    fn = null;
  };
}
function delayOne(fn, _delay) {
  return one(function() {
    return delay(fn, _delay, arguments, this);
  });
}
var _slide = delayOne(throttle(function(event, ui) {
  var selection = $("#indiv").slider("value");
  if (selection > 150) se1();
  if (selection > 100 && selection < 150) se2();
  if (selection > 50 && selection < 100) se3();
  if (selection < 50) se4();
}, 500), 100);
$("#indiv").slider({
  orientation: "vertical",
  max: 200,
  animate: "slow",
  value: 175,
  slide: function(event, ui) {
    $body.off('scroll', onScroll);
    timeocanel();
    _stop = true;
    var stop;
    setTimeout(function() {
      if (stop) return;
      _stop = false;
      $body.on('scroll', onScroll);
    }, 1000);
    timeocanel = function() {
      stop = true;
    }
    _slide();
  }
});
var _stop = false;
var timeocanel = noop;
setInterval(function() {
  $body.off('scroll', onScroll);
  _stop || $body.on('scroll', onScroll);
}, 1000);
var $body = $('#body');
var $inner = $('#inner');
var onScroll = function() {
  var sc = $body.scrollTop();
  var bh = $body.height();
  var ih = $inner.height();
  if (sc > ih) sc = ih;
  var k = sc / (ih - bh);
  if (k > 1) k = 1;
  var v = 20 + (150 * (1 - k));
  if (k == 1) {
    $('#body').addClass('black_line');
  } else $('#body').removeClass('black_line');
  //console.warn(k);
  _stop || $("#indiv").slider("value", v);
};
$body.on('scroll', onScroll);