Toggle Closed Caption in HTML5-Video und Deaktivieren von Standard-Video-Steuerelemente

Question

Ich habe zwei Probleme. Sobald ich das Track-Tag in mein Video-Element eingefügt habe, erscheint der Standard-Controller des Videos. Ich habe benutzerdefinierte Steuerelemente, so ist es ziemlich das Problem.

Sekunde. Ich kann keine Möglichkeit finden, Untertitel bei einem aus zu schalten.

HTML:

JS:

var cc = document.getElementById('cc'); 
function cc(){ 
     var video= document.getElementById('media'); 
     var track1 = video.textTracks[0]; 
     var mytrack = document.getElementById('mytrack'); 
     var track2 = mytrack.track; 
     console.log(track1); 
     console.log(track2); 
    } 
    cc.addEventListener('click',cc,false); 

Answer 1

, wenn Sie einen Hinweis auf controls in Ihrem <video> Tag entfernen, dass die Kontrollen versteckt halten soll (sie beim ersten Laden blinken kann, aber sobald die Video ist geladen sie werden versteckt bleiben) das controls Element ist Boolean: wenn es existiert dann werden sie zeigen, wenn es nicht dann wird sie nicht.

Für Ein- und Ausblenden der Untertitel Sie die mode zu „zeigen“ oder „versteckt“, wie unten

<video autoplay loop id="v"> 
    <source src="Video.mp4" type="video/mp4"> 
    <track id="enTrack" src="entrack.vtt" label="English" kind="subtitles" srclang="en" default> 
    HTML5 video not supported 
</video> 
. 
. 
. 
<script> 
. 
v = document.getElementById("v") 
v.textTracks[0].mode = "hidden"; // "showing" will make them reappear 
    // if you want to show the controls 
v.controls = true; 
. 
</script> 

Beachten Sie, dass YMMV festlegen müssen, wie verschiedene Browser unterschiedliche Verhalten haben, wenn es um Titel geht. Dies funktioniert auf Chrome/Safari unter OSX und IE10 (obwohl auf Safari und IE der Wert des Modus ist "0" für versteckte und "2" für die Darstellung, aber mit dem Text, um sie zu setzen scheint zu funktionieren. Nicht auf iOS getestet