dcsimg
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

Tip: Using the Track HTML5 Tag to Specify Text Tracks

Learn how to use the <track> HTML5 tag to specify text tracks for media elements.


advertisement

WEBINAR:

On-Demand

Building the Right Environment to Support AI, Machine Learning and Deep Learning


The <track> tag specifies text tracks for media elements (<audio> and <video>). You can use the <track> attribute to add subtitles to any video or audio element. Web Video Text Tracks Format (WebVTT) is a format for displaying timed text tracks (such as subtitles or captions) using the <track> element. Values that can be applied to the attribute include subtitles, descriptions, or captions.

Other attributes that can be included in the track tag:

  • kind: represents the kind of text track: caption, chapter, subtitle, description
  • label: represents the title of the text track
  • src: is a obligatory attribute and has the role of specifying the URL of the track file
  • srclang: this attribute identifies the language of the subtitles contained in that file
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8">

<title><track> tag</title>

<body>

<video width="480" height="320" controls>

<source src="video.mp4" type="video.mp4">

<track kind="subtitles" src="Romanian.vtt" scrlang="ro" label="Romanian">

</video>

</body>

</html>

 

Visit the DevX Tip Bank

 





   
Octavia Andreea Anghel is a senior PHP developer currently working as a primary trainer for programming teams that participate at national and international software-development contests. She consults on developing educational projects at a national level. She is a coauthor of the book "XML Technologies--XML in Java" (Albastra, ISBN 978-973-650-210-1), for which she wrote the XML portions. In addition to PHP and XML, she's interested in software architecture, web services, UML, and high-performance unit tests.
Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date