reproducir - Reproduce video en bucle infinito con carga en HTML5

insertar video en html5

Question

Estoy buscando colocar un video en una página HTML5 que comenzará a reproducirse en la carga de la página, y una vez completado, vuelva al principio sin interrupción. El video tampoco debe tener controles asociados, ni ser compatible con todos los navegadores ''modernos'', ni tener la opción de un relleno múltiple.

Anteriormente lo hubiera hecho a través de Flash y FLVPlayback , pero preferiría mantenerme alejado de Flash en la esfera HTML5. Estoy pensando que podría usar el setTimeout de javascript para crear un bucle setTimeout , pero ¿qué debería usar para incrustar el video? ¿Hay algo por ahí que transmita el video como lo haría FLVPlayback ?

Answer 1

El atributo de bucle debería hacerlo:

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

Si tiene un problema con el atributo de bucle (como lo teníamos en el pasado), escuche el evento videoEnd y llame al método play() cuando se active.

Nota 1: No estoy seguro del comportamiento en el iPad / iPhone de Apple, porque tienen algunas restricciones contra la autoplay .

Nota 2: loop="true" y autoplay="autoplay" están en desuso

Answer 2

Puedes hacer esto de las siguientes dos maneras:

1) Usar el atributo de loop en el elemento de video (mencionado en la primera respuesta):

2) y puede usar el evento multimedia ended :

window.addEventListener(''load'', function(){
    var newVideo = document.getElementById(''videoElementId'');
    newVideo.addEventListener(''ended'', function() {
        this.currentTime = 0;
        this.play();
    }, false);

    newVideo.play();

});