Добавил аудио через тег audio, но плеер не появляется. В чём дело?
Хочу, чтобы на странице играла музыка, написал <audio src="song.mp3"></audio>. Файл рядом лежит. Но на странице вообще ничего нет — ни кнопки, ни плеера. Что я забыл?
2 ответа
По умолчанию у <audio> нет видимого плеера — он есть, но невидим, пока ты не попросишь показать кнопки. Добавь атрибут controls:
<audio src="song.mp3" controls></audio>
Теперь появятся кнопка play, ползунок и громкость.
Если всё равно не играет — проверь путь к файлу (как с картинками) и формат: браузеры надёжно понимают .mp3. Чтобы перестраховаться на разные браузеры, можно дать несколько источников:
<audio controls>
<source src="song.mp3" type="audio/mpeg">
<source src="song.ogg" type="audio/ogg">
Ваш браузер не поддерживает аудио.
</audio>
С видео всё так же, только тег <video> и обычно добавляют width:
<video src="clip.mp4" controls width="400"></video>
Маленькое предупреждение: не добавляй autoplay (автовоспроизведение со звуком) — современные браузеры всё равно его блокируют, чтобы музыка не врубалась внезапно. Пусть пользователь сам нажмёт play. Если очень нужно автозапуск — он работает только в паре с muted (без звука).