Добавляем мультимедийные данные

Рубрика: Разное

Мультимедиа — аудио и видео порой очень необходимый элемент для сайта, будь это видеоурок или просто приятная мелодия. Раньше, чтобы их добавить, а еще чтобы правильно отобразить, приходилось изрядно помучиться. Сейчас HTML 5 предлагает уместить все в один парный тег.

Теги <AUDIO> и <VIDEO> парные, и имеют несколько атрибутов. Практически обязательный атрибут SRC задает ссылку на аудио или видеофайл, который нужно вспроизвести. Браузер, наткнувшись на данный тег, может проиграть файл, только загрузить его, или же вообще ничего не предпринимать. Заранее нужно сказать, что эти теги будут являться блочными элементами, то есть их нельзя вставить в абзац, а они создают отдельный.

Чтобы поставить автоматическое воспроизведение и загрузку, нужно добавить атрибут AUTOPLAY без значения. Такое иногда требуется, ведь браузер по умолчанию не производит проигрывания. Еще один атрибут, AUTOBUFFER, который задает автоматическую загрузку медиа. Это полезно, когда нужно убрать задержку перед воспроизведением. Он тоже без значения. Все это время аудио только проигрывалось, но не показывалось, каким образом идет процесс. Чтобы отобразить кнопки управления, контролирующие проигрывание, нужно прописать атрибут CONTROLS. Он покажет пользователю элементы управления, в том месте, где встречен тег. В них входят кнопки запуска или остановки, шкала времени, даже регулирование звука. Причем выглядят они довольно приятно. В случае с видео элементы управления показываются при наведении на содержимое.

У видео есть еще одна возможность — когда запись не запущена, отображается либо первый кадр, либо то изображение, которое задано в атрибуте POSTER. В качестве значения нужно указать ссылку изображения. Получаем код — <AUDIO SRC="ding-dong.waw" AUTOPLAY></AUDIO>. По нему,после загрузки страницы, начнется проигрывание аудиофайла,  который находится в том же каталоге. Ну а для видео <VIDEO SRC="film.ogg" CONTROLS POSTER="film1.jpg"></VIDEO>. Этот код выведет кнопки управления, с рисунком film1 в панеле просмотра.

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

Хочется отметить, что некоторые новые штатные головные устройства в авто уже воспроизводят аудио контент по средствам HTML5.


Оставить комментарий или два

Я не робот!

Оповещать о новых комментариях по RSS