title: JavaScript mouseUp event ignored when mouse is released during drag
body: <p>I have a <code>&lt;div&gt;</code> element that is created in my script and appended to another <code>&lt;div&gt;</code>. I have:</p>
  <pre><code> coverElm.onmousedown = mouseDownEventHandeler;
   document.onmouseup = mouseUpEventHandeler;
   document.onmousemove = mouseMoveEventHandeler;
  </code></pre>
  <p>I have the functions defined and work great and keep track of if the mouse is down with a boolean <code>mouseDown</code>.</p>
  <p><strong>The Problem</strong> - When the mouse is pressed down and is released the <code>document.onmouseup</code> is never handled. I think its because its doing a drag of whatever is in the <code>&lt;div&gt;</code> witch is just a few words of text. I have this issue without text too.</p>
  <p>So what I'm looking for is a way to prevent this odd dragging behavior, or way for <code>onmousedrag</code> to see if the mouse is pressed down of not - <strong>NOT USING THE MOUSE UP AND MOUSE DOWN METHODS</strong></p>
  <p>Here are my functions:</p>
  <pre><code>function mouseUpEventHandeler(e) {
          mouseDown = false;
  }
  function mouseDownEventHandeler(e) {
          mouseDown = true;
  }
  function mouseMoveEventHandeler(e) {
          if (mouseDown) {
                 coverElm.innerHTML =&quot;&lt;p&gt;Mouse down and dragging&lt;/p&gt;&quot;;
          }
  }
  </code></pre>