Навігація
Головна
 
Головна arrow Інформатика arrow Проектування і розробка web-додатків
< Попередня   ЗМІСТ   Наступна >

РОБОТА З ВІДЕО- І АУДІОДАНИМИ

У web-мережі міститься велика кількість відео- і аудіоресурсів. У версіях HTML4 і XHTML для вставки і управління мультимедіа часто використовувалася технологія Flash компанії Adobe або різні плагіни (такі як QuickTime або Windows Media).

У HTML5 для вбудованої обробки браузером мультімедіаданних включені спеціальні елементи <video> та <audio>. Для елементів <audio> і <video> більшість атрибутів є загальними, хоча зрозуміло, що, наприклад, у <audio> немає таких атрибутів, як width і height.

Найпростіший спосіб вставити відео - це використовувати елемент <video> і дозволити браузеру забезпечити інтерфейс за замовчуванням. Атрибут controls вказує призначений для користувача інтерфейс, який бажає використовувати розробник. наприклад:

<Video src- "video.ogv" controls-'controls "poster-'poster.jpg"

width-'320 "height =" 240 "">

<a href="video.ogv''> CKa4aTb ролик </ а>

</ Video>

Необов'язковий атрибут poster може бути використаний для вказівки зображення, яке буде показуватися замість відео до початку відтворення.

Також просто вставити аудіо на сторінку за допомогою елемента <audio>.

<Audio src = "music.oga '' controls-'controls">

<a href="music.oga"> Відтворити музику </ а>

</ Audio>

HTML5 надає елемент <source> для вказівки альтернативних аудіо- та відеофайлів, які браузер може вибрати на основі типу носія або кодека. Атрибут media може бути використаний для

вказівки типу носія, щоб відібрати певні пристрої, атрибут type - для вказівки типу файлу і кодека. наприклад:

<Video poster = "poster.jpg">

"Source src-'video.3gp" type = "video / 3gpp" media = "handheld">

"Source src-'video.ogv" type-'video / ogg; codecs = theora, vorbis ">

"Source src-'video.mp4" type = "video / mp4">

</ Video>

<Audio>

"Source src-'music.oga" type = "audio / ogg">

"Source src = '' music.mp3" type = "audio / mpeg">

</ Audio>

Для розробників, які хочуть більше управляти призначеним для користувача інтерфейсом є API, що включає кілька методів і подій, що дозволяє за допомогою JavaScript управляти відтворенням. Найпростіші методи використовують play (), pause () і currentTime для перемотування в початок. Наступний приклад ілюструє їх використання:

"Video src =" video.ogg "id =" video ">" / video>

<Script> var video = document.getElementByldfvideo "); </ script>

<P>

"Button type =" button '' onclick = '' video.play (); "> Відтворити" / button>

"Button type =" button '' onclick = '' video.pause (); ''> Пауза "/ button>

"Button type =" button "ondick = '' video.currentTime = 0;">

"Перемотати" / button>

 
Якщо Ви помітили помилку в тексті позначте слово та натисніть Shift + Enter
< Попередня   ЗМІСТ   Наступна >
 
Дисципліни
Агропромисловість
Аудит та Бухоблік
Банківська справа
БЖД
Географія
Документознавство
Екологія
Економіка
Етика та Естетика
Журналістика
Інвестування
Інформатика
Історія
Культурологія
Література
Логіка
Логістика
Маркетинг
Медицина
Нерухомість
Менеджмент
Педагогіка
Політологія
Політекономія
Право
Природознавство
Психологія
Релігієзнавство
Риторика
Соціологія
Статистика
Техніка
Страхова справа
Товарознавство
Туризм
Філософія
Фінанси
Пошук