Атрибут loop тега <audio>

Описание

Атрибут loop для тега <audio> указывает, что аудиофайл должен автоматически начинаться сначала по завершении воспроизведения. Это булевый атрибут, который активируется при его наличии (не требует значения).

Пример использования:
<audio controls loop> <source src="background-music.mp3" type="audio/mpeg"> Ваш браузер не поддерживает аудио элемент. </audio>

Особенности работы:

Сценарий Поведение Примечания
Обычное воспроизведение Аудио повторяется бесконечно Без пауз между повторами
С autoplay Автозапуск с бесконечным циклом Требуется muted в большинстве браузеров
В мобильных браузерах Может блокироваться Ограничения авто-воспроизведения

Рекомендации по использованию:

  • Фоновая музыка: Идеально для фоновых звуков и атмосферы
  • Саундтреки: Для непрерывного музыкального сопровождения
  • Эффекты: Циклические звуковые эффекты в играх
  • Демо-режимы: Для демонстрационных стендов

Осторожно: Бесконечное повторение может раздражать пользователей. Всегда предоставляйте элементы управления.

JavaScript альтернатива:

<audio id="myAudio" controls> <source src="sound.mp3" type="audio/mpeg"> </audio> <script> const audio = document.getElementById('myAudio'); audio.addEventListener('ended', function() { this.currentTime = 0; // Перемотка в начало this.play(); // Запуск снова }); </script>

Лучшие практики:

  • Всегда включайте controls для возможности отключения
  • Для веб-сайтов используйте короткие циклы (10-30 секунд)
  • Тестируйте громкость - не должна перекрывать основной контент
  • Предусматривайте кнопку отключения звука

Совместимость с API:

// Программное управление циклом const audio = document.querySelector('audio'); // Включить цикл audio.loop = true; // Выключить цикл audio.loop = false; // Проверить состояние console.log('Цикл включен:', audio.loop);

Совет: Для плавного зацикливания музыки используйте аудиофайлы с плавным началом и окончанием.

Примечание: В отличие от JavaScript-реализации, нативный атрибут loop обеспечивает более плавный переход между повторами без микро-пауз.