Я делаю игру с HTML5 и Javascript.
Как я могу играть в игровой звук через Javascript?
javascript
html
html5-audio
Райан С.
источник
источник
<audio>
. Этот элемент будет иметь соответствующие JS-хуки для «play», «pause» и т. Д.Ответы:
Если вы не хотите связываться с элементами HTML:
Показать фрагмент кода
При этом используется
HTMLAudioElement
интерфейс, который воспроизводит аудио так же, как и<audio>
элемент .Если вам нужно больше функциональности, я использовал библиотеку howler.js и нашел ее простой и полезной.
Показать фрагмент кода
источник
<audio>
. В Википедии есть таблица совместимости аудиоформатов .new Audio()
может воспроизводить файлы WAV во всех браузерах, кроме Internet Explorer.Это просто, просто получите свой
audio
элемент и вызовитеplay()
метод:Проверьте этот пример: http://www.storiesinflight.com/html5/audio.html
Этот сайт раскрывает некоторые другие интересные вещи , которые вы можете сделать , такие как
load()
,pause()
и несколько других свойствaudio
элемента.источник
http://www.schillmania.com/projects/soundmanager2/
SoundManager 2 предоставляет простой в использовании API, который позволяет воспроизводить звук в любом современном браузере, включая IE 6+. Если браузер не поддерживает HTML5, он получает помощь от Flash. Если вы хотите строго HTML5 и без флэш-памяти, есть настройка для этого,
preferFlash=false
Он поддерживает 100% Flash-бесплатное аудио на iPad, iPhone (iOS4) и других устройствах с поддержкой HTML5 + браузеры
Использовать так же просто, как:
Вот демонстрация этого в действии: http://www.schillmania.com/projects/soundmanager2/demo/christmas-lights/
источник
Это довольно старый вопрос, но я хочу добавить немного полезной информации. Автор темы упомянул, что он есть
"making a game"
. Так что для всех, кому нужен звук для разработки игр, есть лучший выбор, чем просто<audio>
тег илиHTMLAudioElement
. Я думаю, вы должны рассмотреть вопрос об использовании Web Audio API :источник
Легко с Jquery
// установить аудио теги без предварительной загрузки
// добавляем jquery для загрузки
// пишем методы для игры и остановки
// решаем, как управлять звуком
РЕДАКТИРОВАТЬ
Чтобы ответить на вопрос @ stomy, вот как вы могли бы использовать этот подход для воспроизведения плейлиста :
Установите ваши песни в объекте:
Используйте функции запуска и воспроизведения, как и раньше:
Загрузите первую песню динамически:
Сброс источника звука для следующей песни в списке воспроизведения, когда текущая песня заканчивается:
Смотрите здесь для примера этого кода в действии.
источник
ended
событие, которое будет выпущено, и запустить следующий аудиофайл в списке (вероятно, вы отслеживаете либо в DOM, памяти JS и т. д. ). developer.mozilla.org/en-US/docs/Web/Events/endedДобавьте скрытый звук и воспроизведите его.
источник
Если вы получаете следующую ошибку:
Это означает, что пользователь должен сначала взаимодействовать с сайтом (как говорится в сообщении об ошибке). В этом случае вам нужно использовать
click
или просто другой прослушиватель событий, чтобы пользователь мог взаимодействовать с вашим сайтом.Если вы хотите автоматически загрузить аудио и не хотите, чтобы пользователь сначала взаимодействовал с документом, вы можете использовать
setTimeout
.Звук начнется через 0,5 секунды.
источник
источник
источник
Довольно простое решение, если у вас есть тег HTML, как показано ниже:
Просто используйте JavaScript для воспроизведения, вот так:
источник
У меня были некоторые проблемы, связанные с объектом аудио обещания возвратом аудиообещания, и некоторые проблемы, связанные с взаимодействием пользователя со звуками, в результате чего я использовал этот маленький объект,
Я бы порекомендовал реализовать звуки воспроизведения, наиболее близкие к пользовательскому событию взаимодействия.
И реализовать это следующим образом:
источник
Я использовал этот метод для воспроизведения звука ...
источник
С требованиями безопасности, которые пользователь должен взаимодействовать с веб-страницей, чтобы разрешить аудио, я так и делаю, основываясь на прочтении многих статей, в том числе на этом сайте.
Поскольку все аудиофайлы были «воспроизведены» на одном и том же OnClick, теперь вы можете воспроизводить их в любое время в игре без ограничений.
Обратите внимание, что для лучшей совместимости не используйте файлы WAV, MS не поддерживает их
Используйте mp3 и ogg, который охватывает все устройства
Пример:
повторить по мере необходимости для всех аудио в игре
Затем:
повторяйте по мере необходимости, за исключением того, что не делайте паузу звука, который хотите услышать при запуске игры
источник
если вы хотите воспроизводить аудио каждый раз, когда страница открыта, сделайте это.
и вызывайте этот playMusic () всякий раз, когда вам нужно в вашем игровом коде.
источник
Вы можете использовать Web Audio API для воспроизведения звуков. Существует довольно много аудио-библиотек, таких как howler.js, soundjs и т. Д. Если вы не беспокоитесь о старых браузерах, вы можете также зайти на http://musquitojs.com/ . Он предоставляет простой API для создания и воспроизведения звуков.
Например, чтобы воспроизвести звук, все, что вам нужно сделать, это.
Библиотека также поддерживает Audio Sprites.
источник
Это какой-то JS, который я придумал для детского AI-проекта, с которым я работаю. Я надеюсь, что это может помочь вам.
источник
Просто используйте это:
Или, чтобы сделать это проще:
Образец:
источник
У меня были некоторые проблемы с воспроизведением звука, особенно после того, как Chrome обновил, что пользователь должен сначала взаимодействовать с документом.
Однако почти во всех решениях, которые я обнаружил, код JS должен активно настраивать слушателей (например, нажатия кнопок) для получения пользовательских событий для воспроизведения звука.
В моем случае я просто хотел, чтобы моя игра играла в BGM, как только игрок взаимодействует с ней, поэтому я сделал себя простым слушателем, который постоянно проверяет, взаимодействует ли веб-страница или нет.
источник
Вот решение для 2020 года, когда вы видите ошибку:
Не будь ловким и подумай, что это старая школа
oclick
, я просто переместу это вниз по странице к моему jQuery или моему внешнему файлу JavaScript. Нет. Это должно бытьonclick
.источник