title: jQuery detect mousedown inside an element and then mouseup outside the element
body: <p>I have something similar to a drawing canvas, and I capture it's state on mouseup for undo purposes. The canvas isn't full screen, so you can draw with a brush and release outside the canvas. Something like this:</p>
  
  <pre><code>$("#element").mousedown(function(){
    $(document).mouseup(function(){
      //do something
    }); 
  });
  </code></pre>
  
  <p>But this doesn't work of course. A plain $(document).mouseup doesn't work either, because I have many other UI elements and it saves the state each time you click on a UI element.</p>
  
  <p>Any ideas?</p>