/html/track:> Текстовая дорожка_

Элемент track

Синтаксис

HTML
<[audio | video]>
  ...
   <track src="...">
  ...
</[audio | video]>

Описание

Элемент track (от англ. "track" ‒ «трек, дорожка») прикрепляет файл текстовой дорожки (субтитры, комментарии) к элементам video и audio. В подобном файле прописывается текст на одном языке (русском, английском, французском и т.д.) и каждому отрывку этого текста устанавливается свой временной отрезок вывода на экран. Количество файлов зависит от того количества языков текстового сопровождения, которое вы хотите установить для определённого мультимедиа элемента.

Примечание

Использование данного элемента особенно актуально для перевода видео на русский и остальные языки, а так же использование для дублирования звуковой информации для людей с проблемами слуха.


Поддержка браузерами

Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Поддерж.
Safari
Поддерж.
iOS
Поддерж.
Android
Поддерж.

Спецификация

Верс. Раздел
HTML
2.0 ---
3.2 ---
4.01 ---
5.0 4.7.9 The track element
5.1 4.7.13. The track element
XHTML
1.0 ---
1.1 ---

Атрибуты

default
Указывает приоритетную дорожку, воспроизводимую по умолчанию.
kind
Указывает тип дорожки.
label
Задаёт заголовок/название к тексту дорожки.
src
Указывает URL-адрес файла с субтитрами.
srclang
Указывает язык текста дорожки (если «kind="subtitles"»).
Глобальные атрибуты
accesskey, class, contenteditable, contextmenu, data-*, dir, draggable, dropzone, hidden, id, inert, lang, spellcheck, style, tabindex, title, translate, xml:lang

Пример использования

Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Элемент track</title>
</head>
<body>
<h1>Пример использования элемента "track"</h1>
<video style="width: 500px; height: 375px;" controls>
<source src="/examples/multimedia/video/Angels.mp4" type="video/mp4">
<source src="/examples/multimedia/video/Angels.ogg" type="video/ogg">
<source src="/examples/multimedia/video/Angels.webm" type="video/webm">
<track kind="subtitles" src="angels.ru.vtt" srclang="ru" label="Русский">
<track kind="subtitles" src="angels.en.vtt" srclang="en" label="English">
<track kind="subtitles" src="angels.fr.vtt" srclang="fr" lang="fr" label="Francais">
<track kind="subtitles" src="angels.de.vtt" srclang="de" lang="de" label="Deutsch">
<p>Ваш веб-браузер не поддерживает элемент "video".</p>
</video>
</body>
</html>
Элемент track