- Autor publikacji
- Virtual Patriot - Administrator
track
- Data publikacji
- Ostatnio edytowano
Przeznaczenie elementu track
Element track
reprezentuje zasób internetowy, który ma pełnić rolę dodatkowego, tekstowego, pojawiającego się w określonym czasie zasobu internetowego przeznaczonego dla zasobu internetowego, który może być reprezentowany przez któryś z elementów HTML należących do kategorii element media.
Dodatkowe artykuły związane z elementem track
Informacje techniczne o elemencie track
- kategoria ogólna
-
brak
- kontekst zewnętrzny
-
jako element dziecko elementu media, lecz przed jakąkolwiek ewentualną zawartością opływającą danego elementu media
- kontekst wewnętrzny
-
brak
- wymagane elementy dzieci
-
brak
- wymagane atrybuty
- zdolność fallback
-
nie dotyczy
- składnia HTML
-
<track>
- pominięcie tagu na początku
-
nigdy
- pominięcie tagu na końcu
-
zawsze
- CSS display
-
inline
Przypuszczalnie domyślne reguły CSS elementu track
/* brak */
Interpretacja elementu track
-
tak
-
tak
-
tak
-
tak
-
tak, lecz od wersji 10
-
tak
Zobacz więcej informacji o interpretacji elementu track.
Opis atrybutów elementu track
default
Przeznaczenie atrybutu default
Atrybut default
wykorzystany wraz z elementem track
pozwala nam określić czy zasób internetowy reprezentowany przez dany element track
powinien pełnić rolę domyślnie włączonego zasobu internetowego.
Tylko jeden element "track" posiadający atrybut "default" wraz z atrybutem kind, którego wartością jest wartość subtitles lub wartość captions, może być elementem dzieckiem elementu media.
Tylko jeden element "track" posiadający atrybut "default" wraz z atrybutem kind, którego wartością jest wartość description, może być elementem dzieckiem elementu media.
Tylko jeden element "track" posiadający atrybut "default" wraz z atrybutem kind, którego wartością jest wartość chapters, może być elementem dzieckiem elementu media.
- Wartość domyślna
-
BRAK
(gdy pominęliśmy atrybut)wartość pusta
(gdy nie podaliśmy wartości)
Wartości atrybutu default
- default
-
Atrybut
default
jest atrybutem logicznym elementutrack
.Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/napisy-pl-01.vtt" kind="subtitles" srclang="pl" label="napisy w języku polskim" default> <track src="https://webkod.pl/files/html/napisy-en-01.vtt" kind="subtitles" srclang="en" label="napisy w języku angielskim"> </video> <!-- KOD ŹRÓDŁOWY PLIKU: napisy-pl-01.vtt --> WEBVTT 00:00:03.000 --> 00:00:06.000 PRZYKŁADOWE NAPISY W JĘZYKU POLSKIM 00:00:08.000 --> 00:00:18.000 Pierwszy Napis 00:00:20.000 --> 00:00:28.000 Drugi Napis 00:00:30.000 --> 00:00:35.000 Trzeci Napis 00:00:37.000 --> 00:00:43.000 Czwarty Napis 00:00:45.000 --> 00:00:50.000 Piąty Napis 00:00:52.000 --> 00:00:56.000 Ostatni Napis </body> </html>
Rezultat
Domyślnie włączonym zasobem internetowym, dla zasobu internetowego "film-01.mp4" reprezentowanego przez element "video", jest zasób internetowy "napisy-pl-01.vtt" reprezentowany przez pierwszy przykładowy element "track", ponieważ do wspomnianego elementu "track" został dodany atrybut "default".
kind
Przeznaczenie atrybutu kind
Atrybut kind
wykorzystany wraz z elementem track
pozwala nam określić informację o tym, jakiego rodzaju jest zasób internetowy reprezentowany przez dany element track
.
Wartości atrybutu kind
- subtitles
-
Wartość
subtitles
oznacza, że zasób internetowy reprezentowany przez dany elementtrack
jest transkrypcją lub tłumaczeniem językowym dialogu.W tym wypadku zasób internetowy reprezentowany przez dany element
track
ma sens, gdy zasób internetowy reprezentowany przez element media posiada dźwięk zawierający dialog, który został utworzony w języku przypuszczalnie niezrozumiałym dla docelowego użytkownika.Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/napisy-pl-01.vtt" kind="subtitles" srclang="pl" label="napisy w języku polskim"> </video> </body> </html>
Ponieważ do przykładowego elementu "track" został dodany atrybut "kind" wraz z wartością "subtitles", przykładowy element "track" reprezentujący zasób internetowy "napisy-pl-01.vtt" zawiera dodatkową informację dla przeglądarki internetowej o tym, że zasób internetowy "napisy-pl-01.vtt" jest rodzaju "subtitles".
- descriptions
-
Wartość
descriptions
oznacza, że zasób internetowy reprezentowany przez dany elementtrack
jest opisem tekstowym, który może zostać przetworzony na dźwięk.W tym wypadku zasób internetowy reprezentowany przez dany element
track
ma sens, gdy docelowy użytkownik jest słabowidzący lub ślepy, albo gdy docelowy użytkownik korzysta z urządzenia nieposiadającego ekranu, np. podczas przemieszczania się środkiem transportu, albo gdy zasób internetowy reprezentowany przez element video posiada treść, która nie jest widoczna w całości.Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/opis-pl-01.vtt" kind="descriptions" srclang="pl"> </video> </body> </html>
Ponieważ do przykładowego elementu "track" został dodany atrybut "kind" wraz z wartością "descriptions", przykładowy element "track" reprezentujący zasób internetowy "opis-pl-01.vtt" zawiera dodatkową informację dla przeglądarki internetowej o tym, że zasób internetowy "opis-pl-01.vtt" jest rodzaju "descriptions".
- chapters
-
Wartość
chapters
oznacza, że zasób internetowy reprezentowany przez dany elementtrack
jest dodatkową nawigacją przeznaczoną dla treści zasobu internetowego reprezentowanego przez element media.Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/nawigacja-pl-01.vtt" kind="chapters" srclang="pl"> </video> </body> </html>
Ponieważ do przykładowego elementu "track" został dodany atrybut "kind" wraz z wartością "chapters", przykładowy element "track" reprezentujący zasób internetowy "nawigacja-pl-01.vtt" zawiera dodatkową informację dla przeglądarki internetowej o tym, że zasób internetowy "nawigacja-pl-01.vtt" jest rodzaju "chapters".
- metadata
-
Wartość
metadata
oznacza, że zasób internetowy reprezentowany przez dany elementtrack
musi zostać obsłużony przez dodatkowy skrypt (np. skrypt języka programowania JavaScript), aby móc spełniać swoją docelową funkcję.Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/animowane-napisy-pl-01.vtt" kind="metadata" srclang="pl"> </video> </body> </html>
Ponieważ do przykładowego elementu "track" został dodany atrybut "kind" wraz z wartością "metadata", przykładowy element "track" reprezentujący zasób internetowy "animowane-napisy-pl-01.vtt" zawiera dodatkową informację dla przeglądarki internetowej o tym, że zasób internetowy "animowane-napisy-pl-01.vtt" jest rodzaju "metadata".
label
Przeznaczenie atrybutu label
Atrybut label
wykorzystany wraz z elementem track
pozwala nam określić nazwę etykiety, jaką powinien posiadać zasób internetowy reprezentowany przez dany element track
.
- Wartość domyślna
-
brak wartości domyślnej
Wartości atrybutu label
- nazwa etykiety
-
Należy podać niepusty ciąg znaków, który chcemy, aby został wykorzystany przez przeglądarkę internetową do określenia interesującej nas nazwy etykiety.
Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/napisy-pl-01.vtt" kind="subtitles" srclang="pl" label="napisy w języku polskim" default> <track src="https://webkod.pl/files/html/napisy-en-01.vtt" kind="subtitles" srclang="en" label="napisy w języku angielskim"> </video> </body> </html>
Rezultat
Nazwą etykiety, jaką posiada zasób internetowy "napisy-pl-01.vtt" reprezentowany przez pierwszy przykładowy element "track", jest nazwa "napisy w języku polskim", ponieważ do wspomnianego elementu "track" został dodany atrybut "label" wraz z wartością "napisy w języku polskim".
src
Przeznaczenie atrybutu src
Atrybut src
wykorzystany wraz z elementem track
pozwala nam określić adres zasobu internetowego, który chcemy, aby był reprezentowany przez dany element track
.
- Wartość domyślna
-
brak wartości domyślnej
Wartości atrybutu src
- URL
-
Należy podać niepusty ciąg znaków w formie adresu URL.
Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/napisy-pl-01.vtt" kind="subtitles" srclang="pl" label="napisy w języku polskim" default> </video> </body> </html>
Rezultat
Zasobem internetowym reprezentowanym przez przykładowy element "track" jest zasób internetowy "napisy-pl-01.vtt" znajdujący się pod adresem "https://webkod.pl/files/html/napisy-pl-01.vtt", ponieważ do wspomnianego elementu "track" został dodany atrybut "src" wraz z wartością "https://webkod.pl/files/html/napisy-pl-01.vtt".
srclang
Przeznaczenie atrybutu srclang
Atrybut srclang
wykorzystany wraz z elementem track
pozwala nam określić informację o języku, jaki posiada zasób internetowy reprezentowany przez dany element track
.
Atrybut "srclang" jest atrybutem wymaganym elementu "track", lecz tylko wtedy gdy wartością atrybutu kind danego elementu "track" jest wartość subtitles.
- Wartość domyślna
-
brak wartości domyślnej
Wartości atrybutu srclang
- symbol języka
-
Należy podać ciąg znaków w formie symbolu języka (Norma ISO 639-1).
Przykładowy Kod HTML
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Darmowy Kurs HTML</title> </head> <body> <video src="https://webkod.pl/files/html/film-01.mp4" controls> <track src="https://webkod.pl/files/html/napisy-pl-01.vtt" kind="subtitles" srclang="pl" label="napisy w języku polskim" default> </video> </body> </html>
Rezultat
Ponieważ do przykładowego elementu "track" został dodany atrybut "srclang" wraz z wartością "pl", przykładowy element "track" reprezentujący zasób internetowy "napisy-pl-01.vtt" zawiera dodatkową informację dla przeglądarki internetowej o tym, że językiem, jaki posiada zasób internetowy "napisy-pl-01.vtt", jest język polski.