Ehab Mamdouh Ismaiel Ehab Mamdouh Ismaiel - 3 months ago 17
Javascript Question

play sound on mousehover

I have a jquery menu and this is the code appears in the php file that calls the menu module and the default.php calls the jquery file of the menu which is hard to edit for me,











however, I would like to add a click sound when mouse over the nav menu li, kindly advice me how to do it, knowing that I can't edit the li a link in the index file to look like this
because it is generated in the jquery file, I only add menu and make the edits in joomla control panel.
Thank you very much.

Answer

You can make use of the HTMLAudioElement in your event handler. Something like this should work.

var audio = new Audio('audio_file.mp3');
$("nav li").mouseover(function() {
  audio.play();
}).mouseout(function() {
  audio.pause(); //optional to stop when not hovered anymore
});