Different Ways to Play a Sound from a Web Page

Back to menu

9. Using a Flash audio player

Although this method requires the Flash plug-in, that does seem to be quite commonly installed. There are a number of Flash players available, but many of them do not support WAV format files. The one I'm using here is by François de Metz.

The latest version of the standalone player files can be downloaded from https://github.com/francois2metz/WavPlayer.

Copy the file wavplayer.swf to your web folder.

The player itself is embedded using this code:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
    width="40"
    height="40"
    id="audio1"
    align="middle">
    <embed src="wavplayer.swf?gui=mini&h=20&w=300&sound=success.wav&"
        bgcolor="#ffffff"
        width="40"
        height="40"
        allowScriptAccess="always"
        type="application/x-shockwave-flash"
        pluginspage="http://www.macromedia.com/go/getflashplayer"
    />
</object>

A little javascript provides a link to the player:

<script>
function getPlayer(pid) {
	var obj = document.getElementById(pid);
	if (obj.doPlay) return obj;
	for(i=0; i<obj.childNodes.length; i++) {
		var child = obj.childNodes[i];
		if (child.tagName == "EMBED") return child;
	}
}
function doPlay(fname) {
	var player=getPlayer("audio1");
	player.play(fname);
}
function doStop() {
	var player=getPlayer("audio1");
	player.doStop();
}
</script>

You can then drive the player from a link or a button like this:

<a href="javascript:doPlay()">doPlay()</a>

doPlay()

<form>
<input type="button" value="Play Sound" onClick="doPlay()">
</form>

You can even change the audio file at play time:

<a href="javascript:doPlay('success.wav')">doPlay('success.wav')</a>

doPlay('success.wav')

Compatibility: Internet Explorer, Firefox, Opera, Chrome.

Next method ...