title: HTML5 Canvas animation clearRect
body: <p>I just started HTML5. I have a problem making a line following the mouse. It works if I don't clearRect( if I remove the line context.clearRect(0, 0, canvas.width, canvas.height);). Any ideea? I attached the code. Thanks</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Test&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;canvas id="myCanvas" width="1000" height="600" style="border:1px solid #c3c3c3;"&gt;
          Your browser does not support the canvas element.
      &lt;/canvas&gt;
      &lt;script type="text/javascript"&gt;
  
          window.onload = function()
          {
  
          };
  
          function captureMousePosition(evt) 
          {
              var c = document.getElementById("myCanvas");
              var context = c.getContext("2d");
  
              context.clearRect(0, 0, canvas.width, canvas.height);
              context.strokeStyle = 'rgba(0,153,255,0.4)';  
              context.beginPath();
              context.moveTo(0,0);
              context.lineTo(evt.x, evt.y);
              context.stroke();         
          }
          document.captureEvents(Event.MOUSEMOVE);
          document.onmousemove = captureMousePosition;
  
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>