title: Tracking the mouse in a DIV Element
body: <p>I want to track the users mouse and display the X &amp; Y coordinates but only if the mouse is in the specific div element called "spielfeld". When the mouse leaves the div element the code should not track the mouse anymore.</p>
  
  <p>So here is my code: </p>
  
  <pre><code>&lt;div id="spielfeld"&gt;
  
    &lt;a id="x_result&gt;0&lt;/a&gt;
    &lt;a id="y_result&gt;0&lt;/a&gt;
  
        &lt;script type="text/javascript"&gt;
  
          function MouseTrack(e) {
            var result_x = document.getElementById('x_result')
            var result_y = document.getElementById('y_result')
  
            result_x.innerHTML = e.layerX;
            result_y.innerHTML = e.layerY;
          }
  
          document.onmousemove = MouseTrack;
  
        &lt;/script&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This code displays the correct position for each element the mouse is over. 
  But not for an specific element.</p>