title: Using jQuery to detect a mouse scroll per instance, not per click
body: <p>What I'm attempting to do is move an element while a user scrolls up or down. I have the mechanics of this within a function called goTo(). I am also trying to track where the user is by using a variable. When the user scrolls up or down, the variable goes up or down by one. This is what my function looks like so far:</p>
  
  <pre><code>$(window).on('DOMMouseScroll mousewheel', function(event){
  
   clearTimeout($.data(this, 'timer')); // NEW CODE 
  
   $.data(this, 'timer', setTimeout(function() { // NEW CODE
  
      if( event.originalEvent.wheelDelta &gt; 0 || event.originalEvent.detail &lt; 0 )
      {
          --curScl;
          goTo(curScl);
  
      } else {
          ++curScl;
          goTo(curScl);
      }
  
   }, 250)); // NEW CODE 
  
  });
  </code></pre>
  
  <p>UPDATE: Per the advice of @Bart Jedrocha, I've added a <code>setTimeout</code> wrapper that keeps the value of <code>curSel</code> from skyrocketing with every scroll. However, there is a delay between when the scroll is executed, and when the element moves. It feels very unnatural. Is there a way to do this without the delay?</p>