title: My implementation of video doesn't work in firefox and safari; only chrome
body: <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html land="en"&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;title&gt;Using video in the canvas tag&lt;/title&gt;
  &lt;script type="text/javascript"&gt;
  
      var vid,ctx;
  
      function init(){
          window.addEventListener("resize",onResize,false);
  
          var can = document.getElementById('canvas1');
          ctx = can.getContext('2d');
  
          vid = document.createElement('video');
          vid.src = 'video.mp4';
          vid.autoplay = true;
          vid.loop = true;
          vid.addEventListener("canplaythrough", play, false);
  
      }
  
  
      function play(){
          setInterval(function() {
              ctx.drawImage(vid, 0, 0);
          }, 1000/23.976);
      }
  
  &lt;/script&gt;
  
  &lt;style type="text/css"&gt;
      body{margin:0;}
  &lt;/style&gt;
  
  &lt;/head&gt;
  
  
  &lt;body onLoad="init();"&gt;
      &lt;canvas id="canvas1" width="1280" height="720"&gt;&lt;/canvas&gt;
  
  &lt;/body&gt;
  
  
  &lt;/html&gt;
  </code></pre>
  
  <p>Im trying to get full screen video by scaling the canvas up, however the code above only works in Chrome. The video does not show up in firefox 10.0.2 nor safari 5.05. I tried three different files: mp4,ogv, and webm. What's wrong with my code. I know there is a  tag but can I scale it the same way I can with a canvas?</p>