Reputation: 173
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
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