Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Combine two clips from two different videos into one video with javascript (client side)?

Does anyone know if this is possible?

The closest thing I found to what I am looking for is this: http://bgrins.github.io/videoconverter.js/

But the "docs" are very minimal.

like image 673
Mike Johnson Jr Avatar asked May 19 '17 03:05

Mike Johnson Jr


1 Answers

You can add 2 videos in one video element

var myvid = document.getElementById('myvideo');
var myvids = [
  "http://www.w3schools.com/html/mov_bbb.mp4", 
  "http://www.w3schools.com/html/movie.mp4"
  ];
var activeVideo = 0;

myvid.addEventListener('ended', function(e) {
  // update the new active video index
  activeVideo = (++activeVideo) % myvids.length;

  // update the video source and play
  myvid.src = myvids[activeVideo];
  myvid.play();
});
<video src="http://www.w3schools.com/html/mov_bbb.mp4" id="myvideo" width="320" height="240" controls style="background:black">
</video>
like image 87
Ananth A Avatar answered Sep 24 '22 14:09

Ananth A