CODEWITHSUNDEEP
jqueryaudio
Erin
Erin

Reputation: 558

Cross-platform, cross-browser way to play sound using jQuery 1.4?

I'm trying to get jQuery to play a sound on element hover/click. (It's like a flash website without flash)

I've tried the methods recommended in Cross-platform, cross-browser way to play sound from Javascript?, the jQuery Sound plugin and a couple of other tutorials without any success. I'm assuming this is because they haven't been updated since 2008.

Does anyone have any recommendations?

Upvotes: 22

Views: 27236

Answers (5)

ThinkFloyd
ThinkFloyd

Reputation: 5021

Audio tag did not work for me in some browsers so this is how I got it done:

function playBuzzer(){
        $("body").append("<embed src='/web/sounds/Buzz.mp3' autostart='true' loop='false' width='2' height='0'></embed>");
}

Whenever I want to play sound (onmouseover, onclick, onload...) I call this function.

Upvotes: 5

FDisk
FDisk

Reputation: 9416

try this: http://swaggplayer.no.de/demos it using the flash to play a sound or this one http://www.schillmania.com/projects/soundmanager2/

Upvotes: 2

Jakub Hampl
Jakub Hampl

Reputation: 40533

Actually it's impossible to do in a truly cross-browser compliant way as for example iPhones will play sound only on a dedicated player "page". However some of the plugins in the other answers should do the job for most (desktop) browsers.

Upvotes: 6

FDisk
FDisk

Reputation: 9416

http://codecanyon.net/item/fancy-music-player-v20-jquery-plugin/498071?ref=1stwebdesigner

Player works like this - first it detects if Flash Player 9 or higher is installed. If yes a hidden flash movie(swf) will be used, that communicates via javascript with the HTML user interface. If no Flash Player is installed, the new HTML5 audio engine will be used, which is supported by all iToys(iPhone, iPad etc.).

Upvotes: 0

Delan Azabani
Delan Azabani

Reputation: 81384

Don't need any of those. The HTML tag, combined with JavaScript, will do the trick.

<audio id="soundHandle" style="display: none;"></audio>
<script>
  soundHandle = document.getElementById('soundHandle');
  soundHandle.src = '/blah/blah.mp3';
  soundHandle.play();
</script>

Upvotes: 33

Related Questions