Меню сайта
Чат
300
Реклама
Главная » 2012 » Август » 3 » HTML5 видео - Как это работает
00:59
HTML5 видео - Как это работает

HTML5 видео - Как это работает

Для отображения видео в HTML5, это все что вам нужно:

Пример

<video width="320" height="240" controls="controls">
  <source src="movie.mp4" type="video/mp4" />
  <source src="movie.ogg" type="video/ogg" />
  Your browser does not support the video tag.
</video>


Контроль атрибут добавляет видео контроля, как воспроизведение, пауза, и объем.

Это также хорошая идея, чтобы всегда включать атрибуты ширину и высоту. Если высота и ширина установлено, пространство, необходимое для видео защищены при загрузке страницы.Тем не менее, без этих атрибутов, то браузер не знает, размер видео, а также не может оставить за собой соответствующие места для этого. Эффект будет, что макет будет меняться во время загрузки (в то время как видео нагрузок).

Вы также должны вставить текст между содержанием <video> и </ видео> тегов для браузеров, не поддерживающих <video>.

<video> Элемент позволяет использовать несколько элементов <source>. <source> элементы можно связать с различных видео файлов. Браузер будет использовать первую признанном формате.


Форматы видео и Поддержка браузеров

В настоящее время существует 3 поддерживаемых форматов видео для <video> элемент: MP4, WebM и Ogg:

БраузерMP4WebMOgg
Internet Explorer 9ДАНЕТНЕТ
Firefox 4.0НЕТДАДА
Google Chrome 6ДАДАДА
Apple Safari 5ДАНЕТНЕТ
Опера 10,6НЕТДАДА
  • MP4 = MPEG-4 файлов с H264 видео кодек и AAC аудио кодек
  • WebM = WebM файлы с VP8 видео кодек и аудио кодек Vorbis
  • Ogg = Ogg файлах с Theora видео кодек и аудио кодек Vorbis

Метки HTML5 видео

ТегОписание
<video>Определяет видео или фильм
<source>Определяет множество ресурсов, средств массовой информации для медиа-элементов, таких как <video> и <audio>
<track>Определяет текст трека в медиаплееры

Просмотров: 288 | Добавил: admin | Теги: HTML 5 видео | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]