Jeffrey van Rossum
Jeffrey van Rossum

Reputation: 173

jQuery: stop audio on mouseleave

I'm using the following script to play a sound when someone hovers a div.

$(document).ready(function(){
 var birdaudio = birdhover.find('audio')[0];    

 $('.sound').mouseenter(function(){ birdaudio.play(); });
 $('.sound').mouseleave(function(){ birdaudio.stop(); });
});

It actually works, but the audio keeps on playing till the end of the sound, even when not hovering anymore. Is there something I could to do to prevent that? I wan't that the audio stops whenever you 'mouseleave' the div.

Hoping for help!

Upvotes: 2

Views: 9599

Answers (1)

maxedison
maxedison

Reputation: 17563

There is no .stop() for HTML5 media elements. You must call pause() on the element instead.

In order to fully replicate the functionality of a stop (both stop the audio and set it's playback position to the very beginning), you would then follow your pause() call with birdaudio.currentTime = 0.

Upvotes: 8

Related Questions