You can just check for animation within the mousewheel function (demo)
$('.page-left, .page-right').on('mousewheel', function(event, delta) {
if ($('.page-left-wrapper, .page-right-wrapper').is(':animated') ) {
return false;
}
var windowHeight = $(window).height();
if (delta < 0) {
prevProject();
}
if (delta > 0) {
nextProject();
}
});
Update: we resolved to use debounce as the long scroll (sliding a finger down a touchpad) needed to be stopped (updated demo).
$(document).keydown( $.debounce( 250, function(e) {
switch (e.which) {
case 38: // up arrow
prevProject();
break;
case 40: // down arrow
nextProject();
break;
}
}) );
$('.page-left, .page-right').on('mousewheel', $.debounce( 250, function(event, delta) {
var windowHeight = $(window).height();
if (delta < 0) {
prevProject();
}
if (delta > 0) {
nextProject();
}
}) );