1

I am using Buzz library for my audio within an HTML5 game. To cross menus without the music stopping, I load each menu in an iframe and the music is launched from the main page:

<body style="overflow: hidden">
    <iframe id="MainFrame" src="./mainmenu.html" 
     frameborder=0 seamless="seamless" class="mainframe"></iframe>

    <script>
        window.onload = function() {
            playLoop('audio/menumusic.mp3');
        }
</script>
</body>

var playLoop = function(name)
{
    sound = new buzz.sound(name, {preload: true, loop: true});
    sound.play();
    setInitialSoundState(sound);
    loops.add(sound);
}

Thing is that I want to be able to toggle/change the music in the pages loaded within the iframe. But whenever I use 

buzz.all().mute();

nothing happens. I'm guessing that the buzz variable in the iframe and the buzz variable from the main page are not the same. How can I access the main page's buzz so that all music is muted correctly?

I'll be happy to give out more details if needed.

icedwater
  • 4,701
  • 3
  • 35
  • 50
David Menard
  • 2,261
  • 3
  • 43
  • 67

1 Answers1

1

Try this:

window.parent.buzz.all().mute();
// window.parent references an iframe's parent window
// or the current window if the call is made from a regular page (i.e. not in an iframe)
Torsten Walter
  • 5,614
  • 23
  • 26
  • May be also `window.parent.contentWindow.buzz.all().mute();` – wizzard0 Jul 05 '12 at 16:39
  • This works fine if you are in the same domain. Unfortunately, I am working locally, so I was getting some safety errors. Switched to postMessage() to msg the main window to stop the music. – David Menard Jul 05 '12 at 17:32