1
<video width="320" height="240" autoplay loop>
  <source src="movie1.mp4" type="video/mp4">
  <source src="movie2.mp4" type="video/mpr">
  Your browser does not support the video tag.
</video>

The code above will play movie1.mp4 over and over again. What I want to achieve is to play those two videos one after the other. I mean after playing movie1.mp4, the movie2.mp4 will play next.

How to achieve this?

The Well
  • 876
  • 1
  • 9
  • 22

1 Answers1

1

You can archieve this by doing:

<video id="homevideo" width="100%" autoplay onended="run()">
    <source src="app/video1.mp4" type='video/mp4'/>
    <source src="app/video2.mp4" type='video/mp4'/>
</video>

video_count =1;
videoPlayer = document.getElementById("homevideo");

function run(){
        video_count++;
        if (video_count == 4) video_count = 1;
        var nextVideo = "app/video"+video_count+".mp4";
        videoPlayer.src = nextVideo;
        videoPlayer.play();
   };

Reference

Community
  • 1
  • 1
Filipe Ferreira
  • 320
  • 2
  • 21
  • 1
    I dont understand why you set the video_count to 4, since there is only 2 videos. if(video_count == 4) video_count = 1 – The Well Jul 03 '15 at 09:28
  • Is there a way to get the size of the video list dynamically? such as videolist.size()??? – The Well Jul 03 '15 at 09:32
  • You just need to get the max count for example if you going to use 3 videos set the max to 4 or you could do a count of the video by assigning a class and due a count for how many times this class is displayed. – Filipe Ferreira Jul 03 '15 at 09:34
  • hehehe... okay... sounds like static, but anyway, thanks! – The Well Jul 03 '15 at 09:35