title: setInterval cannot clear with mouseup
body: <p>I am using mousedown and mouseup to trigger a setInterval function like so:</p>
  
  <pre><code>$("#rotateRight").mousedown(function() {
      intervalIRight = setInterval(rotateRight, 0);
  }).mouseup(function() {
      clearInterval(intervalIRight);
  });
  </code></pre>
  
  <p>This works great, however, if I release the mouse (mouseup) when I am not hovering over <code>$("#rotateRight")</code> then there is technically no 'mouseup' so the interval goes on forever and is never cleared.</p>
  
  <p>I cannot use hover because I want the even to be when a user clicks and holds a mouse. But at the same time, I need to fix this 'mouseup bug.' Any ideas?</p>
  
  <p>UPDATE: New code is as follows, but still does not clear interval because mouseup happens on an iframe, not the DOM.</p>
  
  <pre><code>var intervalIRight;
  var intervalILeft;
  
  
  $("#rotateRight").on('mousedown', function() {
      intervalIRight = setInterval(rotateRight, 0);
  });
  
  $("#rotateLeft").on('mousedown', function() {
       intervalILeft = setInterval(rotateLeft, 0);
  });
  
  $(document).on('mouseup', function() {
      clearInterval(intervalIRight);
      clearInterval(intervalILeft);
  });
  </code></pre>