HTML5 - Pokročilé video

Označené video de HTML5 Máme mnoho možností, jak obohatit naše dokumenty, abychom naše stránky obohatili o vizuální a zvukový obsah, a to díky tomu, že nejsme závislí na pluginy nebo třetích stran, můžeme s našimi videi manipulovat způsobem, který nám umožňuje bez problémů dosáhnout našich cílů.
Předběžné načítání videa
Při práci s těžším obsahem, jako jsou videa, musíme být velmi opatrní, abychom stránku nenasycovali, protože místo obohacení našeho obsahu může dojít k opačnému efektu a zpomalení našeho dokumentu a špatnému procházení.
Předvídat to v HTML5 V prvku video nám umožňuje předem načíst video, které má být zobrazeno tímto způsobem, a ujistit se, že máme malý obsah, než ho ukážeme uživateli, a tím nepřerušíme jeho zážitek na naší stránce.
K tomu můžeme použít následující atributy:
předpětí - je atribut, který nám umožní použít funkci předběžného načtení videa.
žádný - video se nenačte, dokud jej uživatel nepřehraje.
metadata - budou předem načtena pouze metadata videa, tj. podrobnosti o videu, jako je velikost, doba trvání atd.
auto - prohlížeč může stahovat video automaticky, jak to považuje za nutné, prohlížeč může dokonce tuto instrukci ignorovat, je to výchozí chování.
Podívejme se na malý příklad kódu, jak tuto vlastnost použít:

 Příklad Video nelze zobrazit Video nelze zobrazit 

Na následujícím obrázku vidíme, jak prohlížeč interpretuje volání videa pomocí atributů žádný Y metadata:

Je důležité zdůraznit, že musíme tuto vlastnost vyváženě využívat, protože můžeme zbytečně spotřebovávat zdroje i šířku pásma, což by se také mohlo projevit špatnou zkušeností s používáním naší stránky.
Umístěte titulní obrázek k vašemu videu
Jelikož je video důležitou součástí naší stránky, nemůžeme jej nechat zobrazit první snímek, protože může narušit design, a proto můžeme umístit titulní obrázek nebo zástupný symbolDíky tomu můžeme dokonce řídit, který obrázek se má zobrazit, pokud uživatel ještě nedal příkaz k přehrávání videa, k tomu můžeme použít atributy plakátu, k tomu můžeme vidět následující příklad kódu.

 Příklad Video nelze zobrazit  

Podívejme se nyní trochu na to, jak to interpretuje prohlížeč a jak by to viděl uživatel:

ZVĚTŠIT

K dosažení tohoto efektu byl proveden snímek obrazovky videa, poté s vlastností plakát můžeme tento obrázek umístit jako obálku našeho video prvku.
Tím tento tutoriál dokončujeme, díky těmto novým vlastnostem můžeme lépe ovládat způsob, jakým můžeme zobrazovat naše videa, a vytvářet tak nové, bohatší a interaktivnější dokumenty.Líbil se vám tento návod a pomohl mu?Autora můžete odměnit stisknutím tohoto tlačítka, čímž mu dáte kladný bod