Custom Mute Button for Audio Embedding?

Question

I'm trying to set up a custom mute button for the embed tag.

<embed src="intro.mp3" autostart="true" hidden="true" loop="false">

Is there a way to do this via JS?

This worked for the audio tag:

document.getElementById('audio').muted = true;

Answer 1

Nope, there is no muted attribute for embed elements. If you want control over the volume you'll need to use the audio element or a proprietary plugin that you can pass parameters to.

Answer 2

This is obviously an old question, but I had a similar issue... probably not the best solution, but I just placed the embed in a div and removed that div on the 'mutebutton' click, then hid the mute button:

<a href="#" id="mutebutton">mute</a>

<div id="soundDiv"><embed...></embed></div>

$("#mutebutton").click(function() {
            $(this).hide();
            var div = document.getElementById("soundDiv");
            div.parentNode.removeChild(div);
        });

I'm still a noob, so this may not work for you. But it did for me!