Attributen
Dit element bevat de globale attributen.
Dit attribuut geeft aan dat de track moet worden ingeschakeld, tenzij de voorkeuren van de gebruiker aangeven dat een andere track geschikter is. Dit mag maar op één track-element per media-element worden gebruikt. | |
Hoe de teksttrack bedoeld is te worden gebruikt. Indien weggelaten is de standaardsoort subtitles. Als het attribuut een ongeldige waarde bevat, wordt metadata gebruikt.
De volgende trefwoorden zijn toegestaan:
| |
| Een door de gebruiker leesbare titel van de teksttrack, die door de browser wordt gebruikt bij het weergeven van de beschikbare teksttracks. | |
Adres van de track (.vtt-bestand). Moet een geldige URL zijn. Dit attribuut moet worden opgegeven en de waarde van de URL moet dezelfde origin hebben als het document — tenzij het bovenliggende <audio>- of <video>-element van het track-element een crossorigin-attribuut heeft. | |
Taal van de tekstdata van de track. Moet een geldige BCP 47 language tag zijn. Als het kind-attribuut is ingesteld op subtitles, moet srclang zijn gedefinieerd. |
Gebruiksnotities
Datatypen van tracks
Het type data dat track aan de media toevoegt, wordt ingesteld in het kind-attribuut, dat de waarden subtitles, captions, chapters of metadata kan aannemen. Het element verwijst naar een bronbestand met getimede tekst die de browser weergeeft wanneer de gebruiker om aanvullende data vraagt.
Een media-element kan niet meer dan één track hebben met dezelfde kind, srclang en label.
Cue-wijzigingen detecteren
De onderliggende TextTrack, aangeduid met de eigenschap track, ontvangt een cuechange-gebeurtenis telkens wanneer de momenteel weergegeven cue verandert. Dit gebeurt zelfs als de track niet aan een media-element is gekoppeld.
Als de track wel aan een media-element is gekoppeld, doordat het <track>-element als kind van het <audio>- of <video>-element wordt gebruikt, wordt de cuechange-gebeurtenis ook naar het HTMLTrackElement verzonden.
let textTrackElem = document.getElementById("text-track");
textTrackElem.addEventListener("cuechange", (event) => {
let cues = event.target.track.activeCues;
});Teksttracks programmatisch toevoegen
De JavaScript-interface die het <track>-element vertegenwoordigt, is HTMLTrackElement.
De teksttrack die aan een element is gekoppeld, kan worden verkregen via de eigenschap HTMLTrackElement.track, en is van het type TextTrack.
TextTrack-objecten kunnen ook worden toegevoegd aan HTMLVideoElement- of HTMLAudioElement-elementen met behulp van de methode HTMLMediaElement.addTextTrack().
De TextTrack-objecten die aan een media-element zijn gekoppeld, worden opgeslagen in een TextTrackList, die kan worden opgehaald met de eigenschap HTMLMediaElement.textTracks.
Voorbeelden
<video controls poster="/images/sample.gif">
<source src="sample.mp4" type="video/mp4" />
<source src="sample.ogv" type="video/ogv" />
<track kind="captions" src="sampleCaptions.vtt" srclang="en" />
<track kind="chapters" src="sampleChapters.vtt" srclang="en" />
<track kind="subtitles" src="sampleSubtitles_de.vtt" srclang="de" />
<track kind="subtitles" src="sampleSubtitles_en.vtt" srclang="en" />
<track kind="subtitles" src="sampleSubtitles_ja.vtt" srclang="ja" />
<track kind="subtitles" src="sampleSubtitles_oz.vtt" srclang="oz" />
<track kind="metadata" src="keyStage1.vtt" srclang="en" label="Key Stage 1" />
<track kind="metadata" src="keyStage2.vtt" srclang="en" label="Key Stage 2" />
<track kind="metadata" src="keyStage3.vtt" srclang="en" label="Key Stage 3" />
<!-- Fallback -->
…
</video>Technische samenvatting
| Inhoudscategorieën | Geen |
|---|---|
| Toegestane inhoud | Geen; het is een void element. |
| Weglaten van tags | Moet een begintag hebben en mag geen eindtag hebben. |
| Toegestane oudertags | |
| Impliciete ARIA-rol | Geen overeenkomstige rol |
| Toegestane ARIA-rollen | Geen role toegestaan |
| DOM-interface | HTMLTrackElement |