HTML5 video
Author
Albert FloresHTML5 video je HTML prvek zahrnutý ve specifikaci HTML5. Slouží k přehrávání videa či filmů.
Struktura
Prvek video je párový, má tedy koncovou značku. Vše, co je uvnitř tohoto prvku, až na prvky <source>, je považováno za alternativní obsah pro prohlížeče, které prvek video nepodporují. +more Již zmíněný prvek source pak slouží k uvedení alternativních formátů videa. Pokud prohlížeč nedokáže přehrát první, jednoduše zkusí přehrát druhý. Prvek source má povinné vlastnosti src a type, stejné jako u elementu video.
Atributy
Atribut | Možné hodnoty | Popis |
---|---|---|
autoplay | autoplay | Určí, že se má záznam ihned po načtení začít přehrávat |
controls | controls | Určí, že má prohlížeč zobrazit ovládací tlačítka |
height | velikost | Specifikuje výšku videa |
loop | loop | Slouží k automatickému přehrávání od začátku ihned po skončení |
poster | URL | Specifikuje URL náhledového obrázku videa |
src | URL | Specifikuje URL video souboru |
type | MIME type | Specifikuje MIME type souboru videa |
width | velikost | Specifikuje šířku videa |
Podporované formáty
Podpora video formátů v prohlížečích pro prvek video se hodně liší; formát totiž žádná specifikace nezahrnuje a je jen na výrobcích prohlížečů a tvůrcích webových stránek, jaký formát si zvolí.
V prohlížečích zatím nejpodporovanější formát je Ogg Theora (video/ogg, *. ogv), který podporuje Firefox, Opera a Google Chrome. +more Další známý formát je H. 264 (video/mp4, *. mp4), který podporuje Internet Explorer 9, Safari a Google Chrome. Google taktéž vyvinul nový formát pro prezentaci hudby a videí na internetu, WebM (video/webm, audio/webm; *. webm), jehož základem je Matroska - VP8 pro video a Vorbis pro audio. Ten má být brzo podporován ve všech hlavních prohlížečích.
Příklad
Následující úryvek HTML5 kódu vloží do webové stránky přehrávač video s dalšími možnostmi pro prohlížeče nepodporující daný formát a s odkazem na stažení souboru pro starší prohlížeče.
Video si lze stáhnout.
Poznámky
Související články
Externí odkazy
[url=https://web. archive. +moreorg/web/20120206232554/http://www. whatwg. org/specs/web-apps/current-work/multipage/the-video-element. html#the-video-element]Specifikace WHATWG[/url] * [url=http://dev. opera. com/articles/view/introduction-html5-video/]Úvod do HTML5 videa[/url], Opera * [url=http://www. webmproject. org/]WebM Project[/url].