Question

I am using jQuery cycle in combination with a mousewheel plugin. I have built it so that the mousewheel will move through the cycle depending on how the wheel is moved. However, once the cycle changes, I would like to prevent the mousewheel from temporarily moving through the cycle for a moment or until it moves in the opposite direction as the cycle moves too quickly.

Is there any way to stop the event from being fired momentarily after it is fired each time?

I have created a JSBIN:

http://jsbin.com/evaxas/10

EDIT: Fixed an issue with the mousewheel, now it works prev/next

—

EDIT: With the help of r0m4n below, I managed to figure out a good solution. The answer below is good but creates a bit of delay before the scroll is called, so I decided to create a function that can be bound and rebound.

http://jsbin.com/evaxas/13/

function wheelMove(event,deltaY) {
  event.preventDefault();
  $('#cycle').unbind('mousewheel', wheelMove);

  if (deltaY > 0) {
    $('#cycle').cycle('next');
  }
  if (deltaY < 0) {
    $('#cycle').cycle('prev');
  }
}

$(document).ready(function(){
  $('#cycle').cycle({
    fx: 'scrollVert',
    speed: 800,
    timeout: 0,
    after: function(){
      interval = setTimeout(function(){
        $('#cycle').bind('mousewheel', wheelMove);
      },1600);
    }
  });

  $('#cycle').bind('mousewheel',wheelMove);
});

Answer 1

For each move of the mousewheel, you can set a timeout that will delay any further user interaction.

This might need further timing tweaks to be completely perfected but try this js:

if (document.getElementById('hello')) {
  document.getElementById('hello').innerHTML = 'Hello World - this was inserted using JavaScript';
}

$(document).ready(function(){
    $('#cycle').cycle({
        fx: 'scrollVert'
    });

    var interval = "";
    $('#cycle').mousewheel(function(event, delta, deltaX, deltaY) {
        var o = '';
        clearTimeout(interval);
        if (deltaY > 0){                
            interval = setTimeout(function(){
                $('#cycle').cycle('next');
            },400);
        }
        else if (deltaY < 0){
            interval = setTimeout(function(){
                $('#cycle').cycle('prev');
            },400);
        }   
        //console.log(' pageY: ' + event.pageY );
    });  
});