Video

В HTML5 появился новый элемент <video> для внедрения видео на веб страницы. До этого, использование видео на сайте без дополнительных плагинов типа Apple QuickTime или Adobe Flash было невозможным.

Элемент <video> предназначен для того, чтобы избавить разработчиков от танцев с бубнами вокруг видео на сайте. Теперь можно указать несколько видео файлов, а браузеры, поддерживающие HTML5, сами выберут наиболее подходящий для них формат.

Браузеры, не поддерживающие HTML5, будут полностью игнорировать тег <video>. Этим можно воспользоваться и сообщить таким браузерам, чтобы проигрывали видео с помощью плагинов. Kroc Camen разработала решение «видео для всех!», которое использует HTML5, где это возможно, а для «старичков» используется Quick Time и Flash. Это решение не использует Javascript и работает практически для всех браузерах, даже для мобильных.

Если тебе хочется большего, чем просто проиграть видео на странице, тогда понадобится Javascript. Проверка на поддержку элемента <video> использует прием №2, описанный ранее. Если браузер поддерживает video, создается элемент <video>, у которого будет метод canPlayType(). В противном случае, элемент <video> будет иметь стандартный набор свойств. Проверить поддержку видео можно следующей функцией:

function supports_video() {
return !!document.createElement('video').canPlayType;
}

Ну и как обычно, лучше использовать готовое решение, например, Modernizr:

if (Modernizr.video) {
// Давай-ка, посмотрим видео!
} else {
// встроенной поддержки видео нету :(
// наверное, придется юзать QuickTime или Flash
}

Об определении поддерживаемых видео форматах поговорим в следующей статье.

Куда дальше

• следующая — Видео форматы
• предыдущая — Canvas text
• содержание