reproductor - video html5 autoplay

Controles personalizados de video HTML 5 (4)

En la especificación HTML5, hay un attribute controls para <video> .

También vea este artículo: Video en la Web: Sumérjase en HTML5 . Explica:

Por defecto, el elemento no expondrá ningún tipo de controles del jugador. Puede crear sus propios controles con HTML, CSS y JavaScript antiguos. El elemento tiene métodos como play () y pause () y una propiedad de lectura / escritura llamada currentTime. También hay volumen de lectura / escritura y propiedades silenciadas. Entonces realmente tienes todo lo que necesitas para construir tu propia interfaz.
Si no desea construir su propia interfaz, puede indicarle al navegador que muestre un conjunto de controles integrados. Para hacer esto, solo incluya el atributo de controles en su etiqueta.

Al igual que muchos desarrolladores web, estoy esperando transmitir videos que utilicen la nueva etiqueta HTML 5 <video> . La compatibilidad con el navegador definitivamente aún no es lo suficientemente amplia, por lo que es imprescindible utilizar un respaldo Flash / SWF .

Esto me hizo pensar: en Flash, es posible personalizar al máximo los controles de reproducción (pausa, reproducir, detener, buscar, volumen, etc.) en HTML 5. ¿Qué opciones hay para personalizar los glifos, iconos y colores de los controles de video? ¿Se requiere Javascript? Por ejemplo, la siguiente página muestra diferentes controles según el navegador - probado usando FF3.5, Chrome y Safari:

http://henriksjokvist.net/examples/html5-video/

Sería realmente increíble personalizar y estandarizar los controles en los navegadores e incluso coincidir con los controles de Flash utilizados por los navegadores más antiguos.

Para aquellos interesados en un gran reproductor de videos HTML5 con múltiples navegadores, revisen lo que Vimeo ( http://vimeo.com ) está haciendo. Visite cualquier video con un navegador compatible con HTML5 (funciona al menos con Safari, Chrome e IE9) y elija "Cambiar a reproductor HTML5".

Han implementado controles HTML personalizados que reproducen completamente su aspecto y funcionalidad de reproductor Flash. Los controles son idénticos en todos los navegadores.

La mejor implementación cross-browser que he visto hasta la fecha. Incluso usan un elemento <canvas> para animar el selector de volumen.

Supongo que la apariencia de los controles depende del navegador (y, por lo tanto, no es muy personalizable). Podrías ver cómo se ve tu página de prueba en todos los navegadores Litmus a Litmus .

YouTube actualmente ejecuta una versión beta HTML5. Puede activarlo visitando http://www.youtube.com/html5 . Actualmente, no todos los videos se muestran en HTML5 después de activar la versión beta. Los videos que se muestran en HTML5 obtienen una animación de carga diferente para que pueda identificarlos (como este http://www.youtube.com/watch?v=KT1wdjlbyFc ).

Como puede ver, su reproductor de video tiene el mismo aspecto que la versión flash.