Embedd .wav files in HTML page in all browsers (no controls)

javascript html cross-browser wav

20,563

Solution 1

Use one of these. I have only use jPlayer and can strongly recommend it.

jPlayer (requires Flash)

Scriptaculous plugin (works without Flash in Firefox)

MooTools (requires Flash)

Solution 2

I'd detect whether the browser allows the audio tag, and use that in that case.

That looks like this:

<audio src="1.wav" autoplay></audio>

Currently Firefox, Safari and Opera can play Wavs, Chrome as of version 3 can't, not sure about 4.

See http://html5doctor.com/native-audio-in-the-browser/ for info on how to detect whether the browser has the audio tag.

You'd then use your existing solution for IE.

Solution 3

<audio> as per Rich's answer is definitely the way of the future. Unfortunately at the moment there is no IE support and to get the other browsers that support it to be happy you have to use both WAV and (OGG or MP3).

So for the moment you may need to provide other ways instead or as-well-as <audio>.

Personally I would strongly avoid <embed>ding a media player plugin. It won't work on browsers without plugins and you might not get a plugin you expect, and the one you get might not work the same as you expect. There is also <bgsound> on IE only, but controlling it can be annoying.

So I'd probably go for a Flash fallback solution for when <audio> isn't available. Flash has much better acceptance than any of the media player plugins.

Unfortunately, it doesn't natively support WAV, so either you use a (typically slow) WAV reader or you go with MP3 and have multiple audio formats to worry about again!

One day this will all work nicely. One day, probably around 2056.

20,563

Author by

Aramaki

Updated on April 08, 2020

Comments

Aramaki about 4 years

I need to play few wav files on button click. I found solution working in IE but it requires QickTime plugin for Firefox.

Is there any other way?

<html>
    <head>
        <script>
function DHTMLSound(surl) {
  document.getElementById("dummyspan").innerHTML=
    "<embed src='"+surl+"' hidden=true autostart=true loop=false>";
}
        </script>
    </head>
    <body>
        <h1>test</h1>
        <span id=dummyspan></span>
        <input type="button" value="Play" onmouseover="DHTMLSound('1.wav')">
    </body>
</html>

Aramaki over 14 years

mp3 is not available - only wav plugins make firefox download quicktime 30mb
Rich Bradshaw over 14 years

Yes, you'd use your existing idea for IE - you'd just check if it supported audio, if so then use it, if not then try your way.
Amit Patil over 14 years

See the linked question for a couple of Flash WAV players. It's not ideal, but probably better than the horror that is QT/Real/etc.