我视频的实现不会在Firefox和Safari工作;只有铬

<!DOCTYPE html> 
<html land="en"> 
<head> 
<meta charset="utf-8"> 
<title>Using video in the canvas tag</title> 
<script type="text/javascript"> 

    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); 
    } 

</script> 

<style type="text/css"> 
    body{margin:0;} 
</style> 

</head> 


<body onLoad="init();"> 
    <canvas id="canvas1" width="1280" height="720"></canvas> 

</body> 


</html>

我试着通过缩放画布高达得到全屏幕视频，但上面的代码只能在Chrome中。视频无法在Firefox 10.0.2露面，也不Safari浏览器5.05。我尝试了三个文件：MP4，OGV，和WebM。我的代码有什么问题。我知道有一个标签，但我可以扩展它以同样的方式，我可以用帆布？我视频的实现不会在Firefox和Safari工作;只有铬

来源

2012-03-04 Adam

我视频的实现不会在Firefox和Safari工作;只有铬

回答

相关问题