Такое действие в общем то простое, но канители прилично. В деталях это выглядит так. У вас есть свой видео ролик и требуется его показать всему миру.
С одной стороны очень просто ролик залить на свой канал в YouTube, с другой – каждый посетитель вашей страницы может перейти на YouTobe и вы потеряли длительный просмотр. А это влияет на позиции сайта в поиске.
Поэтому придётся видео ролик загрузить на свой хостинг или диск в интернет. Их достаточно много.
А канитель заключается в том, что для воспроизведения видео на HTML 5 придётся ваш ролик конвертировать в три формата расширений.
video/mp4, video/webm, video/ogv. Если коротко, то это позволяет проигрывать видео в различных браузерах и версиях.
Для этого все конвертации делайте онлайн и бесплатно. В итоге, вы получаете три видео записи со своими адресами нахождения, куда вы их загрузили. Например: эти почти беззвучные капли стекающей воды.
http://porog.at.ua/_tbkp/original.mp4
http://porog.at.ua/_tbkp/original.webm
http://porog.at.ua/_tbkp/original.ogv
Можете испрользовать в своих сайтах.
Далее пишем код в тегах video:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ВИДЕО в блоке Р в HTML 5</title>
</head>
<body>
<section>
<h1 style="text-align: center;">Плачущие стёкла</h1>
<p style="text-align: center;">
<video width="90%" controls="controls" preload="auto" autoplay="true" loop="loop" >
<source src="http://porog.at.ua/_tbkp/original.mp4" type='video/mp4'>
<source src="http://porog.at.ua/_tbkp/original.webm" type='video/webm'>
<source src="http://porog.at.ua/_tbkp/original.ogv" type='video/ogv'>
</video>
</p>
</section>
</body>
</html>
90% это ширина видео и можно указать любую. Высота подстроиться автоматом.
controls="controls" панель управления, если убрать, будет не видно.
preload="auto" начало показа автоматически выбрано.
autoplay="true" запуск автоматически.
loop="loop" работает постоянно зацикленно.
Скопируйте код, сохраните в расширении html, кодировка utf-8.
Далее открываете этот файл в браузере и увидите видео.
Вот такая метода позволяет воспроизводить лично ваше видео на вашем лично сайте и только в отдельном блоке любого размера, вплоть до фона страницы.
Да, видео «резиновое», это не маловажно для разных дисплеев.
Аналогия как это внешне работает, взгляните на этой странице
https://servis.kharkov.ua/#p11
Правда, там реализация по другому принципу, но внешее проявление полная аналогия.
Если есть вопросы, задавайте.
Это интересно
0
|
|||
Последние откомментированные темы:
-
Word онлайн бесплатно
(1)
master284
,
04.05.2019
-
Ключевые слова и их связь с запросами
(1)
master284
,
04.05.2019
-
Как скачать Киностудию Windows (Windows Movie Maker) для Windows 10, Windows 8, Windows 7
(4)
Horov
,
23.07.2018
-
Как сделать кнопку своими руками
(1)
master284
,
29.12.2017
-
Какие существуют поисковые системы кроме Yandex и Google?
(1)
Словесник
,
21.12.2016
20240523101730