В HTML5 для вставки видео на сайт добавлен многофункциональный тег <video>. Например чтобы сделать простой плеер достаточно вставить в код:

<video src="/video.mp4"  controls></video>

 

Изменить размер видео, можно задав  атрибуты  width и height.

<video src="/video.mp4" width='300' height='200' controls></video>

Если нужно чтобы видео начало играть сразу после загрузки страницы, используй атрибут autoplay.

<video src="/video.mp4" width='300' height='200' autoplay></video>

Используйте атрибут poster,  он отобразит картинку пока видео не запущенно.

<video src="/video1.mp4" width='300' height='200' controls poster="/HTML5.png"></video>

Атрибут поддерживает форматы GIF, PNG, JPEG.

Чтобы видео отображалось на всех браузерах, используйте контейнер < source >

<video width="300" height="200" controls>

<source src=»video.mp4″ type=»video/mp4″ />

<source src=»video.webm» type=»video/webm» />

<source src=»video.ogv» type=»video/ogg» />

</video>

Управление видео с помощью JavaScript

Используя JavaScript вы можете создать свою панель управления. Самые элементарные это play() для запуска видео,  pause() – остановка и изменение громкости volume от 0 до 1. Вот простой пример запуска видео при загрузке страницы.

<video src="/video.mp4" id="js-video"></video>

<script language=»JavaScript» type=»text/javascript»>

var Video=document.getElementById(‘js-video’);

Video.play();

</script>