0

I want to play a video after another video so I use this code

<video id="example_video_1" autoplay controls="none" width="640" height="300" poster="vlcsnap-2015-01-10-20h41m11s114.png" onended="run()">
    <source src="intro.mp4" type='video/mp4' />
    <source src="intro.webm" type='video/webm' />
    <source src="intro.ogv" type='video/ogg' />
    <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
  </video>

<script>
videoPlayer = document.getElementById("example_video_1");

function run(){

        var nextVideo = "video2.mp4";
        videoPlayer.src = nextVideo;

        videoPlayer.play=autoplay;
        videoPlayer.controls=controls;

   };
</script>

This works fine in chrome but when i play this in firefox the 2nd video (video2.mp4) dose not play, as firefox dose not support mp4 format. So is there any process to set the second video in mp4, webm and ogg file format so that most of browsers can play the video.

emerson.marini
  • 9,331
  • 2
  • 29
  • 46
ayan
  • 5
  • 1
  • 3
  • Did you try checking `videoPlayer.src` to find out which of the three sources it is currently playing? – Philipp Jan 14 '15 at 16:44
  • possible duplicate of [HTML5 Video - Change multiple sources](http://stackoverflow.com/questions/5703203/html5-video-change-multiple-sources) – emerson.marini Jan 14 '15 at 16:44

1 Answers1

0

Your last source <source src="intro.ogv" type='video/ogg' /> Is wrong. You wrote two different formats .ogg is for audio. And you need to establish a folder name that the file is in. With this you need to have the HTML5/CSS3 file right next to the folder in a separate folder. This is the correct code:

<source src="foldername/intro.ogv" type='video/ogv' />

Other than that your code is in great shape.

***I do not know anything about your script because I know nothing about JavaScript, or JQuery. Hopefully this was useful! Sorry :(