Question

new Audio('sounds/mysound.mp3').play();

Im using the above javascript to play sounds on a web project, everything works fine at home on my laptop which is running Windows 7 , tested in both Firefox, and Google Chrome.

The problem i have is that on Windows XP, the sounds wont play at all? I do understand that browser support for the above is a bit sketchy at the moment, as mp3 is not fully supported apparently, in firefox for example.. so im a bit confused?? why does it play on my windows 7 machine, but not on windows xp machines, even in the same browser?

I may well have to look at doing the sounds with a plugin or something, can jPlayer play sounds with no visbable player icons etc.. as all the demos show some form of player on screen?

Any help appreciated.

Thanks Paul

EDIT*** I think if OGG files will work, i`ll have to have both sound file formats in my sounds folder, and then use a javascript variable to add the .ext required depending on what broswer is being used.

check which browser
extVariable = either '.mp3' or '.ogg' accordingly
new Audio('sounds/mysound'+extVariable).play();

That way i dont need if else statments everytime i wish to call a sound :) just set the .ext variable up at the top of page.

i made the following audio test over at http://codepen.io/PaulBrUK1972/full/pGdza and just as i thought using windows XP, the ogg file will play in firefox, but the mp3 wont. It would be interesting to know if the mp3 plays on other peoples windows 7 machines, like it does on mine, even though it shouldnt??

Was it helpful?

Solution

Firefox relies on codex available on the machine to play mp3 to get around licensing issues, so that could cause issues.

If you are looking for a sound library to abstract away the issues of supporting audio on browsers with variable support, I'd recommend SoundJS, which I help develop. It uses the latest audio standards when available, and has a flash fallback for older browsers and systems. using SoundJS, you can write a single codebase that is broadly supported, including on mobile devices.

Hope that helps.

OTHER TIPS

Internet Explorer 9+   can play:  MP3
Firefox 3.6+           can play:  WAV and OGG
Chrome 3+              can play:  MP3 and OGG
Safari  4+             can play:  MP3 and WAV
Opera 9.5+             can play:  WAV and OGG

The above is the list of music file types that can be played in the given browser, that is something i took from the book Pro HTML5 Games - Aditya Ravi Shankar. It's a good book i am still working through it though. If the browser is not causing an issue you should check the following: Check you have speakers/headset/earphones plugged in. Check that the volume is not too low. Check that other audio is working on your PC, play a track on YouTube, or some media player. Check the sound/volume settings and adjust the settings, you may be sending audio out the incorrect channels. Check that you have an up to date sound driver. If that doesn't work check that your sound card is not broken.

What most html5 sound libraries, such as sm2, do to get around the fact that some browsers support only certain audio types is call document.createElement("audio").canPlayType(type) before creating the audio element for the sound.

So I suggest you make a helper function in creating your audio sounds that could look something as what follows (sorry if theres errors untested):

var audioTypes = {
   "ogg": "audio/ogg",
   "mp3": "audio/mp3"//etc
}

//src is an array of sources for a type
var createAudio = function(src, options) {
    var audio = document.createElement("audio");
    for (var i = 0; i < src.length; i++) {
        var type = src[i].slice(src[i].lastIndexOf(".") + 1);
        if(audio.canPlayType(audioTypes[type]) {
            audio.type = audioTypes[type];
            audio.src = src[i];
            return audio;
        }
    }
    throw "Unsupported audio";
}

Now just call

var mySound = createAudio(["sounds/mySound.ogg", "sounds/mySound.mp3"]);
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top