TextTrack

The TextTrack interface—part of the API for handling WebVTT (text tracks on media presentations)—describes and controls the text track associated with a particular <track> element.

Properties

This interface also inherits properties from EventTarget.

TextTrack.activeCues Read only
A TextTrackCueList object listing the currently active set of text track cues. Track cues are active if the current playback position of the media is between the cues' start and end times.
TextTrack.cues Read only
A TextTrackCueList which contains all of the track's cues.
TextTrack.id Read only
A DOMString which identifies the track, if it has one. If it doesn't have an ID, then this value is an empty string (""). If the TextTrack is associated with a <track> element, then the track's ID matches the element's ID.
TextTrack.inBandMetadataTrackDispatchType Read only
Returns a DOMString which indicates the track's in-band metadata track dispatch type. needs details
TextTrack.kind Read only
Returns a DOMString indicating what kind of text track the TextTrack describes. The value must be one of those in the TextTrackKind enum.
TextTrack.label Read only
A human-readable DOMString which contains the text track's label, if one is present; otherwise, this is an empty string (""), in which case a custom label may need to be generated by your code using other attributes of the track, if the track's label needs to be exposed to the user.
TextTrack.language Read only
A DOMString which specifies the text language in which the text track's contents is written. The value must adhere to the format specified in the Tags for Identifying Languages (BCP 47) document from the IETF, just like the HTML lang attribute. For example, this can be "en-US" for United States English or "pt-BR" for Brazilian Portuguese.
TextTrack.mode
A DOMString specifying the track's current mode. Changing this property's value changes the track's current mode to match. Permitted values are listed under Text track mode constants.

Event handlers

TextTrack.oncuechange
A EventHandler specifying a function to be called when a cuechange event occurs. Handling these events lets you know when cues are entered and exited. A given text cue appears when the cue is entered and disappears when the cue is exited.

Methods

This interface also inherits methods from EventTarget.

TextTrack.addCue()
Adds a cue (specified as a TextTrackCue object to the track's list of cues.
TextTrack.removeCue()
Removes a cue (specified as a TextTrackCue object from the track's list of cues.

Example

tbd

Specifications

Specification Status Comment
WebVTT: The Web Video Text Tracks Format Candidate Recommendation  

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic supportChrome Full support 18Edge Full support 12Firefox Full support 31
Notes
Full support 31
Notes
Notes Firefox versions before Firefox 50 didn't display captions when playing media without one or more video tracks being played.
IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
activeCuesChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
cuesChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
idChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
inBandMetadataTrackDispatchTypeChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
kindChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
labelChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
languageChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
modeChrome Full support 18Edge Full support 12Firefox Full support 31
Notes
Full support 31
Notes
Notes Before Firefox 52, using JavaScript to change the mode of a text track that's part of a media element would send one change event to the element's textTracks TextTrackList for each change, even if mutliple changes are made in a single pass through the Firefox event loop. Starting in Firefox 52, these changes are reflected by a single event.
IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
oncuechangeChrome Full support YesEdge Full support 12Firefox Full support 31IE ? Opera ? Safari ? WebView Android Full support YesChrome Android Full support YesEdge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS ? Samsung Internet Android Full support Yes
addCueChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
removeCueChrome Full support 18Edge Full support 12Firefox Full support 31IE Full support 10Opera Full support 15Safari Full support 6WebView Android Full support 4.4Chrome Android Full support 18Edge Mobile No support NoFirefox Android Full support 31Opera Android No support NoSafari iOS Full support 7.1Samsung Internet Android Full support Yes
sourceBufferChrome ? Edge ? Firefox ? IE ? Opera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.

See also

Document Tags and Contributors

Contributors to this page: fscholz, tricki, Sheppy
Last updated by: fscholz,