views:

88

answers:

3

I have a client who requested piano keys as links and he wants them to sound when the mouse hovers over the keys. How can this be done without using flash?

+1  A: 

Browsers have very poor support for sound so most of the time flash is used just to make sound possible. I would suggest looking for an mp3 player that allows you to build your own html interface. In cases like that you'd be able then to call the different parts of the player using JS. Then you'd need to have an mp3 file for each of the keys and play the right one when a key is clicked. At the core of such a tool though would be a flash component running in the background to play the sound, but you wouldn't have to display anything using flash.

I suggest using jPlayer:

http://plugins.jquery.com/project/jPlayer

Peter
+1  A: 

SoundManager2 is a good tool for building Javascript interfaces with sound.

Keep in mind however that browsers do not provide native sound support - that kind of functionality is only available via plugins. As a result, the way that SoundManager2 works (or any Javascript sound library I would guess) is by creating an invisible Flash object on the page and using it as a bridge.

zombat
Browsers with HTML 5 support may also have native sound via the audio element, and Firefox, Safari, and others are already supporting it, though it will not doubt take some time for the user base to all get onto these current browsers.
Rob Tanzola
A: 

Something like this:

<img src="key.gif" onMouseOver="javascript:document.awav.play();">
<embed src="a.wav" hidden=true autostart=false name="awav" mastersound>

Works on IE only if Windows Media Player is setup as the default player for wav files.

As others have mentioned, there is no good way to do this that is cross browser compatible and works regardless of what media player is setup to play wav files. Flash is a better solution.

But, you asked for a javascript solution, so that's what I gave.

BoltBait