다른 비디오에서 녹색 화면 비디오가 실행 중임

이 캔버스에서 .ogg 및 .mp4 파일 인 두 가지 비디오 소스를 실행할 수없는 이유는 무엇입니까? 이 녹색 화면 비디오를 배경색이 숨겨진 다른 비디오로 덮어 쓰려고합니다.다른 비디오에서 녹색 화면 비디오가 실행 중임

<html> 
    <head> 
    <script type = "text/javascript"> 
     function load() { 
     var get1 = document.getElementById("c1"); 
     var set1 = get1.getContext("2d"); 

     var get2 = document.getElementById("c2"); 
     var set2 = get2.getContext("2d"); 

     var video1 = document.getElementById("video1"); 
     var video2 = document.getElementById("video2"); 

     video1.addEventListener('play', function(){runVideo();}); 
     video2.addEventListener('play', function(){runVideo2();}); 

     var runVideo1 = function() { 
      if(video1.paused || video1.ended) { 
      return; 
      } 

      var frameconversion = function() { 
      if(window.requestAnimationFrame) { 
       requestAnimationFrame(runVideo1); 
      } else { 
       setTimeout(runVideo,0); 
      } 
      }; 
     }; 

     var runVideo2 = function() { 
      if(video2.paused || video2.ended) { 
      return; 
      } 

      var frameconversion2 = function() { 
      if(window.requestAnimationFrame) { 
       requestAnimationFrame(runVideo2); 
      } else { 
       setTimeout(runVideo2,0); 
      } 
      } 
     } 
     } 
    </script> 
    </head> 
    <body onload="load()" style="background:grey"> 
    <video id = "video1" controls="true"> 
     <source src = "video.ogg" /> 
    </video> 
    <video id = "video2" controls="true"> 
     <source src = "Helicopter Bell Fly By with Sound on green screen - free green screen 6.mp4" /> 
    </video> 
    <canvas id = "c1" width="500" height="300"></canvas> 
    <canvas id = "c2" width="500" height="300"></canvas> 
    </body> 
</html>

출처

2014-07-08 user3816224

함수는 서로 호출하는 것 외에는 아무 것도하지 않습니까? – Kaiido

이 링크는 질문에 직접 답변하지는 않지만 https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas에도 도움이 될 수 있습니다. – Squirrl

This article on Metia 캔버스 녹색 스크린 (크로마 키) 비디오 작업 HTML5 예를 나타낸다. 보시다시피 배경을 정적 이미지 및 비디오 소스로 두 가지로 변경할 수 있습니다.

출처

2015-07-06 14:21:48 BoffinbraiN

다른 비디오에서 녹색 화면 비디오가 실행 중임

답변

관련 문제