title: Fire event after mouse moves 200 pixels
body: <p>I'm using the following script to detect mouse movement left or right on an element.</p>
  
  <p>It works great, and depending on the direction, I trigger an image slider to slide left or right. I'm having issues figuring out how to add another variable to this though. I would only like the event to fire after X pixels. So if the mouse is moved left 200 pixels, then the event would fire.</p>
  
  <p>Here's a fiddle of my current setup. <a href="http://jsfiddle.net/wMMrh/1/" rel="nofollow">http://jsfiddle.net/wMMrh/1/</a></p>
  
  <p>I've tried adding <code>if (i++ &gt; 200) { //do something }</code> to <code>mousemovement</code>, but that hasn't helped me.</p>
  
  <pre><code>(function ($) {
          var options = {};
          var oldx = 0;
          var direction = "";
          var stop_timeout = false;
          var stop_check_time = 150;
          $.mousedirection = function (opts) {
              var defaults = {};
              options = $.extend(defaults, opts);
              $(document).bind("mousemove", function (e) {
                  var activeElement = e.target || e.srcElement;
  
                  if (e.pageX &gt; oldx) {
                      direction = "right";
                  } else if (e.pageX &lt; oldx) {
                      direction = "left";
                  }
  
                  clearTimeout(stop_timeout);
                  stop_timeout = setTimeout(function () {
                      direction = "stop";
                      $(activeElement).trigger(direction);
                      $(activeElement).trigger({
                          type: "mousedirection",
                          direction: direction
                      });
                  }, stop_check_time);
  
                  $(activeElement).trigger(direction);
                  $(activeElement).trigger({
                      type: "mousedirection",
                      direction: direction
                  });
                  oldx = e.pageX;
              });
          }
      })(jQuery)
  
      $(function () {
          $.mousedirection();
          $(".iosSlider").bind("mousedirection", function (e) {
  
              if (!$(".iosSlider").hasClass("moving")) {
  
              if (e.direction == "left")
                  $(".iosSlider").iosSlider('nextSlide');
              else
                  $(".iosSlider").iosSlider('prevSlide');
              }
  
          });
      });
  </code></pre>