Как заставить MP3-файл воспроизводиться на фоне страницы HTML / CSS / JS?

#javascript #html #css #google-chrome

#javascript #HTML #css #google-chrome

Вопрос:

Хотелось бы, чтобы MP3-трек воспроизводился в фоновом режиме сразу после загрузки страницы HTML / CSS / JavaScript.

Пока что можно использовать только проигрыватель с элементами управления внизу страницы:

Нижняя часть веб-страницы

используя следующий код:

  <audio id="bg_music" class="audio" controls loop>
                <source src="audio/silent-night.mp3"
                    type="audio/mp3">
                Your browser does not support the audio element.
            </audio>

Развернуть фрагмент

Хотелось бы найти способ автоматического воспроизведения MP3-файла после загрузки веб-страницы браузером (Chrome).

Спасибо, Бенджамин

1. developer.mozilla.org/en-US/docs/Web/Media/Autoplay_guide

2. Согласно статье, кажется, что мой файл .js нуждается в изменении, но я не уверен, с чего начать. @Quentin не могли бы вы помочь? < drive.google.com/drive/folders /… >

3. Согласно статье, то, что вы хотите, невозможно.

4. привет @Quentin Одним из примеров может быть эта страница < quantumgame.io/level/1 >, который был разработан с использованием Vue.js < en.wikipedia.org/wiki/Vue.js >

Ответ №1:

Вам нужно добавить атрибут autoplay , и это будет сделано. Вы можете дополнительно указать значение autoplay=true или autoplay=false , но все же, если вы его не укажете, он автоматически сочтет его истинным, если вы просто добавите атрибут.

 <audio id="bg_music" class="audio" autoplay controls loop>
  <source src="https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3" type="audio/mp3" />
    Your browser does not support the audio element.
</audio>

Развернуть фрагмент

1. Обычно это не работает на современных браузерах.

2. false недопустимое значение для autoplay атрибут.

3. спасибо @Quentin за ссылку на статью разработчика.

4. спасибо @Deadpool за фрагмент кода. К сожалению, это все еще не работает: < waggish-wish.surge.sh >