50 lines
3.2 KiB
Markdown
50 lines
3.2 KiB
Markdown
|
---
|
|||
|
|
title: HTML5 Audio
|
|||
|
|
localeTitle: HTML5 Audio
|
|||
|
|
---
|
|||
|
|
## HTML5 Audio
|
|||
|
|
|
|||
|
|
Перед HTML5 аудиофайлы должны были воспроизводиться в браузере с помощью подключаемого модуля, такого как Adobe Flash. HTML-код
|
|||
|
|
|
|||
|
|
элемент используется для вставки звукового контента в документы. Он может содержать один или несколько источников звука, представленных с использованием атрибута src или [исходного](source) элемента
|
|||
|
|
|
|||
|
|
Следующий фрагмент кода добавляет аудиофайл с именем файла `tutorial.ogg` или `tutorial.mp3` . элемент указывает альтернативные аудиофайлы, которые может выбрать браузер. В браузере будет использоваться первый распознанный формат.
|
|||
|
|
|
|||
|
|
#### Пример 1
|
|||
|
|
|
|||
|
|
```html
|
|||
|
|
|
|||
|
|
<audio controls>
|
|||
|
|
<source src="tutorial.ogg" type="audio/ogg">
|
|||
|
|
<source src="tutorial.mp3" type="audio/mpeg">
|
|||
|
|
Your browser does not support the audio element.
|
|||
|
|
</audio>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
#### Пример 2.
|
|||
|
|
|
|||
|
|
```html
|
|||
|
|
|
|||
|
|
<audio src="https://s3.amazonaws.com/freecodecamp/simonSound1.mp3" controls loop autoplay>
|
|||
|
|
</audio>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
Атрибут `controls` включает в себя элементы управления аудио, такие как воспроизведение, пауза и громкость. Если вы не используете этот атрибут, никакие элементы управления не будут показаны.
|
|||
|
|
|
|||
|
|
Элемент `<source>` позволяет указать альтернативные аудиофайлы, которые может выбрать браузер. В браузере будет использоваться первый распознаваемый формат. Текст между тегами `<audio>` и `</audio>` может отображаться в браузере, который не поддерживает элемент HTML5 `<audio>` .
|
|||
|
|
|
|||
|
|
Атрибут autoplay автоматически воспроизводит ваш аудиофайл в фоновом режиме. Считается лучшей практикой, позволяющей посетителям выбирать воспроизведение аудио.
|
|||
|
|
|
|||
|
|
Атрибут preload указывает, что браузер должен делать, если плеер не настроен на автовоспроизведение.
|
|||
|
|
|
|||
|
|
Атрибут loop будет воспроизводить ваш аудиофайл в непрерывном цикле, если упомянутый
|
|||
|
|
|
|||
|
|
Поскольку это html5, некоторые браузеры не поддерживают его. Вы можете проверить его на странице https://caniuse.com/#search=audio
|
|||
|
|
|
|||
|
|
#### Дополнительная информация:
|
|||
|
|
|
|||
|
|
https://caniuse.com/#search=audio
|
|||
|
|
|
|||
|
|
https://www.w3schools.com/html/html5\_audio.asp
|
|||
|
|
|
|||
|
|
https://msdn.microsoft.com/en-us/library/gg589529(v=vs.85).aspx
|