Аудио

Последнее обновление: 21.04.2016

Для воспроизведения звука без видео в HTML5 применяется элемент audio. Он во многом похож на элемент video. Для настройки элемента audio мы можем использовать следующие его атрибуты:

  • src: путь к аудиофайлу

  • controls: добавляет элементы управления воспроизведением

  • autoplay: устанавливает автовоспроизведение

  • loop: задает повторение аудиофайла

  • muted: отключает звук по умолчанию

  • preload: устанавливает режим загрузки файла

Действие всех этих атрибутов будет аналогично их действию в элементе video.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Аудио в HTML5</title>
	</head>
	<body>
		<audio src="mobile_phone.mp3" controls></audio>
	</body>
</html>
Аудио в HTML5

Опять же в зависимости от браузера внешний вид элементов управления может отличаться. Выше приведен пример для Google Chrome. А в Firefox они будут выглядеть немного иначе:

Audio в HTML5 в Firefox

Поддержка форматов аудио

Ключевым моментом для работы с аудио является поддержка браузером тех или иных форматов. На данный момент подавляющее большинство браузеров поддерживают mp3. Однако если у нас есть неуверенность, что наше аудио в определенном формате будет поддерживаться браузером пользователя, то мы можем использовать вложенный элемент source и указать аудио в иных форматах:

<audio width="400" height="300" controls>
	<source src="mobile_phone.mp3" type="audio/mpeg">
	<source src="mobile_phone.m4a" type="audio/aac">
	<source src="mobile_phone.ogg" type="audio/ogg">
</audio>

Как и в случае с элементом video, здесь у элемента source устанавливается атрибут src с ссылкой на файл и атрибут type - тип файла.

НазадСодержаниеВперед

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850