I've added background music to a website i'm building (don't kill me).
Whereas in IE the element is called BGSOUND, I tried to have a button to pause
the music, the button removes the entire element and re-adds it, however
turns out removing the element only restarts the music for IE.

How do I stop music being played by the BGSOUND element via javascript?

Current code:

<!--[if IE]>
    <BGSOUND id="bgmusic" SRC="<?php echo bloginfo('stylesheet_directory'); ?>/bgmusic.mp3" LOOP="true">
<![endif]-->

When I fire the mand document.getElementById('bgmusic').stop()
I get Object doesn't support property or method 'stop'

I've added background music to a website i'm building (don't kill me).
Whereas in IE the element is called BGSOUND, I tried to have a button to pause
the music, the button removes the entire element and re-adds it, however
turns out removing the element only restarts the music for IE.

How do I stop music being played by the BGSOUND element via javascript?

Current code:

<!--[if IE]>
    <BGSOUND id="bgmusic" SRC="<?php echo bloginfo('stylesheet_directory'); ?>/bgmusic.mp3" LOOP="true">
<![endif]-->

When I fire the mand document.getElementById('bgmusic').stop()
I get Object doesn't support property or method 'stop'

• javascript
• html
• background-music

• 1 I'd still want to kill you for using <BGSOUND>, provided that you have no control on putting a background music at all =)) – Ege Özcan Commented Apr 20, 2011 at 10:27
• that's why I want to know the mand for stopping it - to create a control... Don't blame the developer, blame the client ;) – Asaf Commented Apr 20, 2011 at 10:29
• Indeed: the bgSound object doesn't have a stop method. – Marcel Korpel Commented Apr 20, 2011 at 10:30
• I blame the developer. The client doesn't know any better, you should. Instead of doing whatever the client asks, propose a better solution. – Sindre Sorhus Commented Apr 20, 2011 at 11:07
• Not an answer, because this is just speculation, but have you tried putting the bgsound elment inside a iframe, then on stop, destroying the iframe? – Alohci Commented Apr 20, 2011 at 11:34

6 Answers 6

An ugly work around is by setting the volume to -10000:

document.getElementById('bgmusic').volume = -10000;

I had a similar situation with the page of a client. I found that removing the src property of the bgsound elements is the best way to avoid the restart music problem in IE.

var bgsoundElems = document.getElementsByTagName('bgsound');
for(var i = 0; i < bgsoundElems.length; i++){
   bgsoundElems[i].src = '';
}

I suggest using Flash instead. Not only will you have more control over the music, but it will work across browsers too. Today more users have Flash player than IE.

When user presses Pause: Remove the element and store it in a variable
When user presses Play : Get the element from the variable and add it to the DOM

I remend using SoundManager.

It will use HTML5 audio when it can, and will otherwise fall back to Flash. And it has a unified and easy API.

If you want to perform a stop(), you can just set src to an empty value. Works in IE11 (with IE8 emulation as well).