title: If mousedown then trigger mousemove else do nothing
body: <p>I have a technical issue and I am not sure what the best way is to solve it.</p>
  
  <p>Basically im working on an audio progress bar where the user can change the position of the song. This should be done by either clicking or by keeping the mousedown and moving it.</p>
  
  <pre><code>elem.addEventListener("mouseup", function(event){
    elem.removeEventListener("mousemove", fn);
  });
  
  elem.addEventListener("mousedown", function(event){
    elem.addEventListener("mousemove", function(event){
        // Stuff to do
    }, fn);
  });
  </code></pre>
  
  <p>So essentially:</p>
  
  <p>If mouse is held down and then moved do something. If mouse is released prevent the trigger of <code>mousemove</code>.</p>
  
  <p>I know if I continue with this it might work but it looks like a horrible mess to me. I dont want to pick up bad habits. </p>
  
  <h3>My question is: How do I make make this work using best practices?</h3>
  
  <p>Note: I also tried the following:</p>
  
  <pre><code>function fn(event) {
  if(event.button == 0) {
        elem.addEventListener("mousemove", function(event){
            // Stuff to do
        });
  }
  }
  </code></pre>
  
  <p>What i'm missing here !</p>