title: HTML5 video previous - next and auto play
body: <p>I'm new to this site and I am new to HTML5 and Javascript aswell. 
  It's not that I am a beginner, I kinda understand HTML5 and Javascript when I see it, I just can't write it proper myself. </p>
  
  <p>I have many videos, all mp4, all same size, all in the same folder on the server. 
  I already got them to play one after another without break. I don't have any controls. 
  Looks like this (a code I found and copied and changed as far as I understood it): </p>
  
  <p><strong>BODY</strong></p>
  
  <pre><code>&lt;video id="homevideo" width="1022px" height="766px" autoplay onended="run()"&gt;
      &lt;source src="video1.mp4" type='video/mp4'/&gt;
  &lt;/video&gt;
  </code></pre>
  
  <p><strong>SCRIPT</strong></p>
  
  <pre><code>&lt;script&gt;
  video_count =1;
  videoPlayer = document.getElementById("homevideo");
  
  function run(){
          video_count++;
          if (video_count == 16) video_count = 1;
          var nextVideo = "video"+video_count+".mp4";
          videoPlayer.src = nextVideo;
          videoPlayer.play();
     };
     &lt;/script&gt;
  </code></pre>
  
  <p>It all looks like this now: 
  <a href="http://www.test.pluskat.de/video/try/" rel="noreferrer">Presentation</a></p>
  
  <p>What I want: 
  I want a previous and a next function.
  So, I have two buttons, a previous and a next button. When I click on the next button, the next video will start and play automatically (no loop). When I click on previous button, the previous video will play again (no loop). So I can simply switch between all my videos forward and backwards. 
  Like this for example: 
  <a href="http://i.imagebanana.com/img/ov3jgut2/idee.JPG" rel="noreferrer">IMAGE</a></p>
  
  <p>What do I have to add to my code? What to change? I know hot do make buttons ect. 
  Would be nice if someone could give me a clear code for this. Nothing with play or pause or anything. </p>
  
  <p>Thanks very much!</p>