Stack Overflow на русском Asked on December 4, 2021
Как воспроизвести аудио-файл при наведении на кнопку?
К сожалению, при наведении на элемент сразу после загрузки страницы, воспроизведения нет, а в консоли появляется ошибка Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first т. е., play () не удалось, потому что пользователь не взаимодействовал с документом в первую очередь. Это из-за того, что браузер не считает mouseout, mouseover, mouseenter, mousemove событиями, подтверждающими взаимодействие с документом. Эту ситуацию можно исправить так:
<button id="button">Hover me</button>
<div id=mydiv></div>
<script>
let btn = document.getElementById("button");
btn.onmouseenter = function(){
mydiv.innerHTML = "<iframe src='https://www.soundjay.com/button/sounds/beep-07.mp3' allow='autoplay' style='display: none'></iframe>";
};
</script>
Answered by Опан on December 4, 2021
Можно сделать так.
let btn = document.getElementById("button");
btn.addEventListener("mouseenter", function(event) {
let sound = document.getElementById("Sound");
sound.play();
}, false);
<div class="animatedButton">
<audio id="Sound" src="https://www.soundjay.com/button/sounds/beep-07.mp3"></audio>
<button id="button">Hover me</button>
</div>
Answered by Enokin on December 4, 2021
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP