Warning: Playing audio on usual site navigation actions like hover or clicking will most certainly annoy your site's visitors and drive them away. That said, there are some clients who insist on this and hence this article.
net tuts+ and css-tricks share identical code for adding audio HTML5 element to body dynamically via jQuery when an event like click or hover happens.
Here's how code provided in the above sites can be implemented in WordPress.
Works in: Firefox, Chrome, Safari, Opera, IE9+.
Step 1
Create a .ogg version of your mp3 sound at Media.io.
Step 2
Upload mp3 and ogg files to a directory, say /sounds under your site's root.
Step 3
Create a file named say, load-audio.js in js directory under the active theme having this code:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.
Excellent.
It works like a charm. But maybe you should add something to remove the audio tag after it has been played because at the current state you keep adding audio knots to the body, everytime menu item is klicked.