Background Music that stops playing when video is played

Question

ツ Hi, I was wondering how I can add background music to a webpage that would ~~fade away~~ stop when I play an embedded video ^{(especially Youtube)} and then start again when the video gets over.

The code I use to embed audio is:

<embed src="example.mid" autostart="true" loop="true">

I'm also aware that HTML5 has an audio tag, but can somehow that produce the effect I need (which is the music stopping when a video is played)?

^{Don't worry, I want to use this on an html based presentation and not an actual webpage.
EDIT: I've edited this question so as to make it a bit more clear.}

score 1 · Accepted Answer · edited May 23 '17 at 12:12

1

With <audio> tag you can control the volume programmatically via Javascript.

Specifically, the issue how to fade out the volume has an jQuery based example here:

HTML5 <audio> playback with fade in and fade out

edited May 23 '17 at 12:12

Community

1
1

answered Feb 27 '13 at 13:19

Mikko Ohtamaa

82,057
50
264
435

Ok, thank you, but how can I set the volume to zero when a video starts playing? – MisterGeeky Mar 06 '13 at 10:59
Yes. Start video playback via Javascript and just before you call video.play() do video.volume = 0. – Mikko Ohtamaa Mar 06 '13 at 14:47

score 0 · Answer 2 · answered Feb 27 '13 at 13:18

0

I'm not too good at HTML5 but you can use eventlistners in javascript for this. onload event to load a function that will play the music and an onclick event on the video to remove the audio when the video is played.

answered Feb 27 '13 at 13:18

Bazinga777

5,140
13
53
92

I'm not too good at javascript, so a code snippet would be nice. – MisterGeeky Mar 06 '13 at 10:53

Background Music that stops playing when video is played

2 Answers2