If <video> plays a stop <audio>

Question

On a webpage, I use a couple of audio tags for mouse sounds and a video tag for playing videos.

Now that the video is playing, the sound should be stopped and muted. The sound starts as follows:

$(this).mouseover(function() { $('audio#' + $(this).attr('title') + '_sound').trigger('play'); }); 

Now you need to add something like this, I tried a couple of things that none of them work:

 $(this).mouseover(function() { if($('#video') is NOT playing) { $('audio#' + $(this).attr('title') + '_sound').trigger('play'); } }); 

Has anyone done something like this before?

Any help is appreciated :-)

Thanks!

Answer 1

You must register an event listener that will be called whenever a video tag pause signal has been acknowledged.

 var v = document.getElementsByTagName("video")[0]; v.addEventListener("pause", function() { audio.trigger("play"); }, true); 

Answer 2

HTML5 has a paused attribute.

 var v = document.getElementsByTagName("video")[0]; $(this).mouseover(function() { if(v.paused){ // checks to see if video is paused $('audio#' + $(this).attr('title') + '_sound').trigger('play'); } }); 

Answer 3

 var video = document.getElementById("myVideo"); var music = document.getElementById("myMusic"); var noOverlap = setInterval( if(myVideo.paused == false){ myMusic.pause(); } , 1000); 

This will check if the two will overlap every second and by default, play the video and pause the music.