title: How to connect onmousemove with onmousedown?
body: <p>I want to press the mouse button and move the cursor, showing the coordinates of the cursor while the button is pressed. When i stop clicking it should stop showing the coordinates.</p>
  
  <p>Code:  </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;Example&lt;/title&gt;
    &lt;style&gt;
      body {
        height: 3000px;
      }
    &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script&gt;
    (function() {
      "use strict";
  
      document.onmousedown = handleMouseDown;
      function handleMouseDown(event) {
        console.log("down")
      }
  
      document.onmousemove = handleMouseMove;
      function handleMouseMove(event) {
        var dot, eventDoc, doc, body, pageX, pageY;
  
        event = event || window.event;
        if (event.pageX == null &amp;&amp; event.clientX != null) {
          eventDoc = (event.target &amp;&amp; event.target.ownerDocument) || document;
          doc = eventDoc.documentElement;
          body = eventDoc.body;
  
          event.pageX = event.clientX +
            (doc &amp;&amp; doc.scrollLeft || body &amp;&amp; body.scrollLeft || 0) -
            (doc &amp;&amp; doc.clientLeft || body &amp;&amp; body.clientLeft || 0);
          event.pageY = event.clientY +
            (doc &amp;&amp; doc.scrollTop  || body &amp;&amp; body.scrollTop  || 0) -
            (doc &amp;&amp; doc.clientTop  || body &amp;&amp; body.clientTop  || 0 );
        }
        console.log("left: " + event.pageX + "px -- right: " + event.pageY + "px");
      }
    })();
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Thank you in advance.</p>