HTML5 video will not loop on Android devices

Question

After some hours of trying, I want to ask how to loop a video on Android devices using the HTML5 video tag.

To be some kind of browser independent, I included video.js to play the videos. Everything worked fine for Firefox and Chrome, but on my Android device (SSG3 with Android 4.0.4) the video won't start or loop.

<video id="model_video" autoplay loop preload="auto" data-setup="{}" width="90%"  height="90%" poster="images/black.jpg"> 

did not start the video. But this was easily solved by calling video.start() in JS. But looping does not work with that. Even if the loop attribute seems to be supported, it causes problems. With attribute loop=false or even with the missing loop attribute, it is still set to true.

There are a couple of websites pointing out that there is the need of adding an eventlistener. But unfortunately, it didn't work.

Answer 1

The solution is to set the loop attribute to false using JS. Even with loop=false as an attribute of the video tag or with missing loop attribute, video.loop returns true. So to get the looping done, the following snippet did the trick:

    var video = document.getElementById("model_video"); 
    //this did the trick
    video.loop = false; 
    video.addEventListener('ended', function() { 
      video.currentTime=0.1; video.play(); }, false);
    video.play();

Cheers!