¿Cómo puedo crear controles de video HTML5 personalizados?

Question

Estoy interesado en crear un reproductor de video personalizado en HTML5. No tengo problemas para incorporar medios de video html5 utilizando el formato dual de Ogg y h.264. Mi problema principal es hacer referencia a la API para el elemento de etiqueta de video. ¿A qué propiedades y oyentes de eventos tengo acceso a través de javascript?

Answer 1

Para una interfaz de usuario básica, todo lo que necesita es pausa y volumen de reproducción.

HTMLVideoElement = document.getElementById("myvideo"); 
HTMLVideoElement.play(); 
HTMLVideoElement.pause(); 
HTMLVideoElement.volume = 1; /* values 0 to 1 */ 

Éstos son agradables

duration = HTMLVideoElement.duration; 
currentTime = HTMLVideoElement.currentTime; 

Esto imprimirá la lista completa, pero ir más allá del HTML5 API documentadas con precaución.

<video id="myvideo"> 
<source id="vidsource"> 
</video> 
<script> 
var HTMLVideoElement = document.getElementById("myvideo"); 
for (var key in HTMLVideoElement) { 
    document.write("<li>"+ key + ": " + HTMLVideoElement[key]); 
} 
</script>