mode property

Sets or gets a value that represents whether a text track is currently disabled, hidden, or showing.

This property is read/write.

HTML5 A vocabulary and associated APIs for HTML and XHTML, Section 4.8.10.12Internet Explorer 10

 

Syntax

JavaScript
object.mode = mode
mode = object.mode

 

Property values

Type: number

Returns the mode of the TextTrack object.

ValueCondition
OFF
0

The TextTrack is disabled; events are ignored by the document.

HIDDEN
1

The track is active, but the video player is not actively displaying cues. The document object maintains a list of active cues and events are being fired.

SHOWING
2

The TextTrack is active. The video player is actively displaying cues, depending on kind. The document object maintains a list of active cues and events are being fired.

 

Standards information

Examples

The following example gets the labels and modes for each TextTrack associated with a video element.


  </head>
  <body>
    <h1>Show text track modes example</h1>
    <video id="video1" controls  >
      <source src="http://ie.microsoft.com/testdrive/Videos/BehindIE9ModernWebStandards/Video.mp4">
      <track id="entrack" label="English subtitles" kind="captions" src="entrack.vtt" srclang="en" default>
      <track id="sptrack" label="Spanish subtitles" kind="captions" src="estrack.vtt" srclang="es">
      <track id="detrack" label="German subtitles" kind="captions" src="detrack.vtt" srclang="de">
    </video>
    <br />
    <button id="gettracks" >View modes</button>
    <div id="display"></div>

  <script>
    
    document.getElementById("gettracks").addEventListener("click", function () {
      var display = document.getElementById("display");
      display.innerHTML = "";
      var mytracks = document.getElementById("video1").textTracks;  //  get the textTrackList
      for (var i = 0; i < mytracks.length; i++) {
        //append track label and mode to inner text of <div>
        display.innerHTML += (mytracks[i].label + " mode: " + mytracks[i].mode + "<br/>");
      }
    }, false);
  </script>




See also

TextTrack

 

 

Show: