Mouseover Sound on a Web page by AB

Let me start by saying this onmouseover sound method is only supported by Internet Explorer and will not let your page validate. As well, this is a very annoying little script that can easily be overused.

There is little need for audio on a Web page since operating systems like Windows have their own sounds when you click on links, and these are not overwritten by this script. However, there is no default mouseover sound, and if you have an area on a webpage meant for mouseovers then this script is perfect.

Why?

I thought of using this technique since ABS now has tabs, and short popping sounds when hovering over these tabs would make for a great audio effect.

The method is simple, and requires JavaScript in the head of the document and the onmouseover event for any tag on a Web page document - not just on links.

I have read up on many methods to add sound to mouseovers, and have come up with the following as the simplest method. Better methods use a combination of Flash and XML but are more complicated.

How?

Add this code in the head of your Web page:

<script type="text/javascript">
function PlaySound(url) {
document.all.sound.src = url;
}
</script>

You can leave it as it is, or specify the URL path to the sound file in each function, so you won't have to specify it in the body.

How? 2

Add this deprecated tag (that means an old not-supposed-to-be-used-anymore tag) to the body:

<bgsound id="sound" />

Changing the id here is possible, but I have also broken the JavaScript doing so.

How? 3

Then add this as an example in the body:

<a onmouseover="PlaySound('doit.wav')" href="http://www.albinoblacksheep.com/">Visit</a>

Remember to replace doit.wav with the path to your sound file. You can use WAV, MP3 or other common sound files. You can even use onmouseout instead of, or in addition to, onmouseover for when a user moves the mouse away from the area.

Where?

Try it out by hovering over the link:

The sound is the character Groundskeeper Willie from The Simpsons of course.

Remember that you must be using Internet Explorer for the script to work.

If you are actually going to be using this effect on your site, please link back to this page to share the knowledge. Also, use this effect sparingly.

When?

In areas with a large hitspace the sound may play multiple when hovering the mouse around the hitspace.

Having a visual hover effect may be slowed down by the sound.