So i wanted to overlay 2 files so they played together using html video controls , this is because the file it too large to fit in one whole bit . I wanted to add two videos , one with audio but a black screen and one with video but no audio and overlay.
I tried
<!DOCTYPE html>
<html>
<body>
<h1>The video element</h1>
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</body>
</html>
but it doesn't actually play them together on further testing.
does anyone know how i could link them together so that when it pause both of the files pause, unpause and can be skipped to a certain timestamp. I am unsure if this is accomplish and if it is possible using java-script, can you please show me how!
Adding several audio and video elements to the same page is no problem and controlling them with one set of controls again achievable, so this could mean when the user pressed play they would all trigger to start play.
However, even if the play button for all is pressed at the exact same time they would not be in sync, elements would ultimately start at slightly different times (buffer, pre-loads etc) and I think it would be this part that would make the idea of overlaying video with audio and playing them in sync a non starter from the outset.