Come posso creare controlli video HTML5 personalizzati?

Question

Mi interessa creare un video player personalizzato in HTML5. Non ho problemi ad incorporare supporti video html5 utilizzando il doppio formato di Ogg e h.264. Il mio problema principale è nel fare riferimento all'API per l'elemento tag video. Con quali proprietà e ascoltatori di eventi posso accedere tramite javascript?

Answer 1

Per un'interfaccia utente di base tutto ciò che serve è la pausa e il volume di riproduzione.

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

Queste sono belle

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

Questo stamperà l'elenco completo, ma andare oltre l'HTML5 documentato API con cautela.

<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>