HTML 5 видео поток на сайте

Теги <video> </video> определяют видеопоток на сайте:


 <!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />

</head>

<body>


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

Ваш браузер не поддерживает теги <video> </video>! Обновите версию браузера!

</video>


</body>

</html>

Тег <source /> определяет источник видео:


  <video controls="controls">

 <source src="video.m4v" type="video/mp4" /> <!-- MPEG4 для браузеров Safari -->         

 <source src="video.ogg" type="video/ogg" /> <!-- Ogg Theora для  Firefox -->          

</video>

Атрибуты и значения

autoplay="autoplay" – видео воспроизводится сразу после загрузки страницы.
autobuffer="autobuffer" – видео воспроизводится уже в момент загрузки страницы.
controls="controls" – панель управления видеоплеером.
loop="loop" – по окончанию, видео проигрывается снова.
src="url" – источник видео.
type="video/ogg" – определяет формат видео.
height="" – высота видеоплеера.
width="" – ширина видеоплеера.

В примерах видно, файлы каких форматов были использованы. Будем надеяться, что разработчики web-браузеров со временем сойдутся во мнениях и выберут какой-то один видео формат, который получит кроссбраузерную поддержку. Но это в будущем, а пока довольствуемся тем, что есть.

Теги <video> </video>, <source /> впервые представлены в спецификации HTML 5, которая пока не имеет статус рекомендации. Новые теги могут не интерпретироваться устаревшими версиями браузеров, но у вас всегда есть альтернатива в виде вставки видео с YouTube.com.

Дата публикации: Февраль 2010 | Обновление: Май 2012

HTML звук или музыка на сайте HTML видео на сайте Новые CSS уроки

Сохранить в сервисы и закладки