7
Chciałbym zapytać, dlaczego nie mogę uruchomić dwóch różnych źródeł wideo, które są plikami .ogg i .mp4 w tym obszarze roboczym. Próbuję zastąpić ten zielony ekran wideo innym filmem, w którym ukryto jego kolor tła.uruchamianie wideo z zielonego ekranu w innym filmie
<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>
Twoje funkcje nie robią nic prócz nawiązywania połączeń? – Kaiido
Ten link może być również pomocny https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas, chociaż nie odpowiada bezpośrednio na pytanie. – Squirrl