title: Loop a function while key is pressed
body: <p>I'm trying to move a div up and down using two keys in Javascript. The idea is that while a certain key is depressed, a function loops and adds to the div's 'top' style value each time. The basic function works, but I can't get it to loop and I can't get anything to respond to a keypress.</p>
  
  <p>It's hard to find info on keypress handling in Javascript, it seems most people use jQuery to handle that. </p>
  
  <p>Is my use of the do-while loop correct? is there a better way to handle keydown and keyup events?</p>
  
  <p>Here's my code:</p>
  
  <pre><code>var x = 0;
  console.log(x);
  
  function player1MoveDown() {
              var value = document.getElementById("player1").style.top;
              value = value.replace("%", "");
              value = parseInt(value);
              value = value + 1;
              value = value + "%";
              document.getElementById("player1").style.top = value;
              console.log(value);
          }    //moves paddle down; adds to paddle's 'top' style value
  
  function player1MoveSetting() {
      x = 1;
      do {
          setInterval(player1MoveDown(), 3000);
      }   
      while (x == 1);
      console.log(x);
  } //paddle moves while x=1; runs player1MoveDown function every 3 seconds
  
   function player1Stop() {
      x = 0;
   }
  </code></pre>
  
  <p>And here's the relevant bit of HTML:</p>
  
  <p><code>&lt;div class="paddle" id="player1" style="top:1%" onkeydown="player1MoveSetting()" onkeyup="player1Stop()"&gt;&lt;/div&gt;
  </code></p>