HTML5 - Разширено видео

Tagged video de HTML5 Имаме много възможности да обогатим нашите документи, за да направим страниците ни по -богати по отношение на визуално и слухово съдържание, благодарение на факта, че не зависим от плъгини или трети страни, можем да манипулираме нашите видеоклипове по начин, който ни позволява да постигаме целите си без проблеми.
Предварително зареждане на видео
Когато работим с по -тежко съдържание, като видеоклипове, трябва да сме много внимателни да не наситим страницата, тъй като това вместо обогатяване на съдържанието ни може да постигне обратния ефект и да забави нашия документ и да осигури лошо преживяване при сърфиране.
Предвиждайки това през HTML5 Във видео елемента той ни позволява предварително да заредим видеоклипа, за да бъде показан по този начин, като се уверим, че имаме малко съдържание, преди да го покажем на потребителя и по този начин не прекъсваме тяхното преживяване на нашата страница.
За това можем да използваме следните атрибути:
предварително зареждане - е атрибутът, който ще ни позволи да използваме функцията за предварително зареждане на видео.
нито един - видеото няма да се зареди, докато потребителят не го пусне.
метаданни - само метаданните на видеоклипа ще бъдат предварително заредени, тоест детайлите на видеото, като размер, продължителност и т.н.
кола - браузърът може да изтегли видеоклипа автоматично, както сметне за необходимо, браузърът дори може да игнорира тази инструкция, това е поведението по подразбиране.
Нека да видим малък пример за код как да използваме това свойство:

 Пример Видео не може да се покаже Видеото не може да се покаже 

На следващото изображение виждаме как браузърът интерпретира обаждането към видеото, използвайки атрибутите нито един Y метаданни:

Важно е да се подчертае, че трябва да използваме балансирано това свойство, тъй като можем да консумираме ненужно ресурси, както и честотна лента, което също може да доведе до лошо преживяване при използването на нашата страница.
Поставете корично изображение за вашия видеоклип
Тъй като видеоклипът е важна част от нашата страница, не можем да му позволим да покаже първия кадър, тъй като може да наруши дизайна, за това можем да поставим изображение на корицата или заместител, с това можем дори да контролираме кое изображение да се показва, ако потребителят все още не е дал заповед за възпроизвеждане на видеоклипа, за това можем да използваме атрибутите на плаката, за това можем да видим следния пример за код.

 Примерно видео не може да се покаже  

Сега нека видим малко как браузърът интерпретира това и как потребителят би го видял:

Увеличете

За да се постигне този ефект, това, което беше направено, беше екранна снимка на видеоклипа, след това със собствеността постер можем да поставим това изображение като корица на нашия видео елемент.
С това завършваме този урок, с тези нови свойства можем да контролираме по -добре начина, по който можем да показваме нашите видеоклипове и по този начин да създаваме нови, по -богати и по -интерактивни документи.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка