Такое действие в общем то простое, но канители прилично. В деталях это выглядит так. У вас есть свой видео ролик и требуется его показать всему миру.
С одной стороны очень просто ролик залить на свой канал в 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
|
|||
Последние откомментированные темы:
-
За физическим миром существует волновой мир.
(1)
Alex2436
,
19.02.2022
-
Находка.
(1)
zalozni
,
16.02.2022
-
«Тунгусский Феномен» - дело рук Николы Теслы. (Завещание).
(1)
Валерий !!
,
27.01.2022
-
А народ пока терпит.
(1)
kauperwud
,
06.12.2021
-
Загадочные явления: Телепортация.
(1)
Вольдемар Ртищев
,
22.11.2021
20250313094510