Autor publikacji
Virtual Patriot - Administrator

Element media - atrybut "poster"

Data publikacji
Ostatnio edytowano

Za pomocą elementu video w oknie przeglądarki internetowej możemy wyświetlić zasób multimedialny, który to zasób multimedialny może między innymi posiadać obraz (np. wideo).

Gdy wartością atrybutu preload elementu video jest wartość różna od wartości none, wtedy w oknie przeglądarki internetowej mogą pojawić się różne domyślne informacje o zasobie internetowym reprezentowanym przez dany element video (np. pierwsza klatka posiadana przez wspomniany zasób internetowy).

Przykład:

<video src="https://webkod.pl/files/html/film-01.mp4" controls></video>

Rezultat:

Jeżeli chcemy mieć wpływ na to, jaki obrazek powinien być widoczny w widocznym obszarze elementu video, przed rozpoczęciem odtwarzania zasobu internetowego reprezentowanego przez dany element video, wtedy należy skorzystać z atrybutu poster.

Przykład:

<video src="https://webkod.pl/files/html/film-01.mp4" poster="https://webkod.pl/files/html/film-01-okladka-01.png" controls></video>

Rezultat:

Przed rozpoczęciem odtwarzania zasobu internetowego film-01.mp4 znajdującego się pod adresem https://webkod.pl/files/html/film-01.mp4 oraz reprezentowanego przez przykładowy element video, w widocznym obszarze wspomnianego elementu video widoczny jest obrazek znajdujący się pod adresem https://webkod.pl/files/html/film-01-okladka-01.png, ponieważ do wspomnianego elementu video został dodany atrybut poster wraz z wartością https://webkod.pl/files/html/film-01-okladka-01.png.

Ponadto, gdy element video reprezentuje zasób internetowy w postaci pliku .mp3, wtedy również możemy skorzystać z atrybutu poster.

Przykład:

<video src="https://webkod.pl/files/html/utwor-01.mp3" poster="https://webkod.pl/files/html/utwor-01-okladka-01.png" controls></video>

Rezultat: