Работа с аудио в HTML5.
Всем привет! В прошлой статье мы рассмотрели, как встраивать видео в HTML5, а сегодня я хотел бы поподробнее рассмотреть, как встраивать аудио в HTML5.
Встраивание аудио в HTML5 очень похоже на встраивание видео, так что, если вы еще не читали предыдущую статью, то сначала прочитайте ее, потому что здесь будет очень много схожего.
Чтобы вставить аудио на страницу, используется тег audio.
<audio src="path/to/audio/file.mp3"></audio>
У данного тега также есть атрибут controls
<audio src="path/to/audio/file.mp3" controls></audio>
Атрибут autoplay
<audio src="path/to/audio/file.mp3" controls autoplay></audio>
Атрибут loop
<audio src="path/to/audio/file.mp3" controls autoplay loop></audio>
Отключение звука с помощью атрибута muted
<audio src="path/to/audio/file.mp3" controls autoplay muted></audio>
Конечно же, атрибут preload
<audio src="path/to/audio/file.mp3" controls preload="auto"></audio>
Также, поддерживается возможность указать время начала и конца воспроизведения
<audio src="file.mp3#t=7,17" controls></audio>
Данная возможность, как и видео, появилась недавно, поэтому мы также можем указать какой-то текст для старых браузеров, неподдерживающих данный функционал, или встроить другой плеер.
<audio src="path/to/audio/file.mp3">
К сожалению, ваш браузер не поддерживает HTML5 аудио
</audio>
Также, есть тег source, который делает абсолютно то же самое, что и тег source для видео.
<audio>
<source src="file.mp3"></source>
<source src="file.ogg"></source>
</audio>
И, конечно, его атрибут type.
<audio>
<source src="file.mp3" type='audio/mpeg'></source>
<source src="file.ogg" type='audio/ogg; codecs=flac'></source>
</audio>
Как видите, обе эти возможности работают примерно одинаково, так что их использование не должно вас затруднить.
А у меня на этом все, спасибо за внимание и удачи!
-
Создано 23.08.2014 20:02:22
-
Михаил Русаков
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.