HTML 5 video & Mootools

HTML 5 video & Mootools

Además de la ventaja que el HTML 5 ofrece a la hora de reproducir videos sin necesidad de usar un plugin de terceros, está el hecho de poder implementar controles para de la reproducción con bibliotecas como Mootools.

HTML 5 video & Mootools es un tutorial (en inglés) que explica como implementar con Mootols, controles para video HTML 5.

Por ejemplo, para unos controles de reproducción, pausado y rebobinado de video se requiere un código muy simple:

<button onclick="$('myvid').set('currentTime', 0)">rewind</button>
<button onclick="$('myvid').play()">play</button>
<button onclick="$('myvid').pause()">pause</button>

Para mostrar el tiempo de reproducción:

$('myvid').addEvent('timeupdate', function(an_event){
 $('timemeter').set('html', this.get('currentTime').toFixed(1));
 });

En el tutorial HTML 5 video & Mootools, también explican cómo agregar un botón para silenciar el sonido (mute), controlar el volumen y además se puede probar una demostración para lo cual es necesario un navegador que soporte HTML 5 como Chrome.

HTML 5 video & Mootools

Visitar: www.chipwreck.de/blog/2010/03/02/html-5-video-mootools

Por Diego Cambiaso

Comunicador Social, Desarrollador de Software y UX Designer. Blogger desde el 2006, creador de Pixelco Tech. Viajero y fotógrafo. Entusiasta del diseño, apasionado por la tecnología y el social media. EN-ES-IT