What is the html to make a sound effect of balloon popping on rollover?

Question

I study graphics as one of my subjects at school. Currently, my task is to make a website for a party so I have started to create the homepage. The home page has four balloons on it and when you roll over them they pop. But, what I also want them to do is to play a balloon popping sound effect when you roll over them and they pop.

However, I cant work out what the HTML would be to achieve this.

The website: partybox.businesscatalyst.com

Answer 1

This cannot be done efficiently using only HTML, as it will require the use of <audio> as in

<audio autoplay>
    <source src="file.wav" type="audio/wav"><!--file.wav will replace your sound file with the pop effect-->
</audio>     

However, the <audio> still required to be started (in case of controls) or dynamically created (in case of autoplay) - which will still require JavaScript.

A simpler JavaScript method would be like - on your onclick or onhover function, simply add this JavaScript Code:

var sound = new Audio("file.wav"); //file.wav will replace your sound file with the pop effect
sound.play(); //Play the sound