Javascript 我的视频实现没有'；不要在firefox和safari中工作；只有铬在画布标记中使用视频 var-vid，ctx；函数init（）{ addEventListener（“resize”，onResize，false）； var can=document.getElementById（'canvas1'）； ctx=can.getContext（'2d'）； vid=document.createElement（“视频”）； vid.src='video.mp4'； vid.autoplay=true； vid.loop=true；参见附录列表（“canplaythrough”，play，false）； } 函数播放（）{ setInterval（函数（）{ ctx.drawImage（vid，0,0）； }, 1000/23.976); } 正文{页边距：0；}_Javascript_Html_Html5 Video

Javascript 我的视频实现没有'；不要在firefox和safari中工作；只有铬在画布标记中使用视频 var-vid，ctx；函数init（）{ addEventListener（“resize”，onResize，false）； var can=document.getElementById（'canvas1'）； ctx=can.getContext（'2d'）； vid=document.createElement（“视频”）； vid.src='video.mp4'； vid.autoplay=true； vid.loop=true；参见附录列表（“canplaythrough”，play，false）； } 函数播放（）{ setInterval（函数（）{ ctx.drawImage（vid，0,0）； }, 1000/23.976); } 正文{页边距：0；}

javascript html

Javascript 我的视频实现没有'；不要在firefox和safari中工作；只有铬在画布标记中使用视频 var-vid，ctx；函数init（）{ addEventListener（“resize”，onResize，false）； var can=document.getElementById（'canvas1'）； ctx=can.getContext（'2d'）； vid=document.createElement（“视频”）； vid.src='video.mp4'； vid.autoplay=true； vid.loop=true；参见附录列表（“canplaythrough”，play，false）； } 函数播放（）{ setInterval（函数（）{ ctx.drawImage（vid，0,0）； }, 1000/23.976); } 正文{页边距：0；},javascript,html,html5-video,Javascript,Html,Html5 Video,我试图通过放大画布来获得全屏视频，但是上面的代码只在Chrome中有效。firefox 10.0.2和safari 5.05中都没有显示该视频。我尝试了三种不同的文件：mp4、ogv和webm。我的代码有什么问题。我知道有一个标签，但我可以用画布来扩展它吗？一些使用当前所有支持HTML5的浏览器的实现，包括Firefox、Safari和Chrome（基于新的全屏API）： <!DOCTYPE html> <html land="en"> <head>

我试图通过放大画布来获得全屏视频，但是上面的代码只在Chrome中有效。firefox 10.0.2和safari 5.05中都没有显示该视频。我尝试了三种不同的文件：mp4、ogv和webm。我的代码有什么问题。我知道有一个标签，但我可以用画布来扩展它吗？

一些使用当前所有支持HTML5的浏览器的实现，包括Firefox、Safari和Chrome（基于新的全屏API）：

<!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>