Home › Forums › JavaScript › mute – unmute sounds on website.
- This topic is empty.
-
AuthorPosts
-
January 26, 2015 at 2:38 pm #194280chauhanheenaParticipant
Hi,
I’m using a script to play sound on the click event of buttons and anchor tags.and i call this function on the click event of anchor tags, buttons , images etc
I want to add a feature of muting and unmuting these sounds with a toggle speaker like button.
could anyone help me with the code.
January 26, 2015 at 2:59 pm #194281shaneismeParticipantWhat have you tried?
P.S. I don’t like playing sounds on websites unless it’s after someone clicked a “play” button.
January 26, 2015 at 3:59 pm #194285Paulie_DMemberAgreed, don’t take control of my viewing experience away from me.
By all means offer am ‘enhanced’ experience if you want but it should never be enabled by default.
Give me the option to turn it on…not the option to turn it off.
January 26, 2015 at 5:38 pm #194291ShikkedielParticipantNo argument there. The basics of setting volume are quite simple :
http://www.w3schools.com/tags/av_prop_volume.asp
http://www.w3schools.com/tags/av_prop_muted.aspJanuary 26, 2015 at 6:41 pm #194295chauhanheenaParticipanthttp://codepen.io/chauhanheena/pen/PwjvWr
for some reason the sound doesnt play in codepen , its because of the link but otehrwise onthe website it plays correct.
the mute script works fine.
i need to unmute the mute like a toggle switch.n its a client requirement to play sound. i too am not alright with the sound thing n chose to give the mute option.
January 26, 2015 at 10:44 pm #194304ShikkedielParticipantI’m wondering where the
killClick()
function came from – I find it an odd approach, it apparently empties click events of all elements (13 in total in the case of this pen), even if there aren’t any to begin with. I’d go for something like this (untested) :function muteAudio(){ els=document.getElementsByTagName('audio'); for (var j = 0; j < els.length; j++) { els[j].muted = true; } }
The selector would have to be adjusted to whatever is used exactly on the site of course. For toggling mute, you could check the boolean value of the first audio element and flip all values accordingly.
Edit – it’s probably easier to keep track of mute by using another variable as the ‘switch’ (instead of checking the audio elements)…
var silence = true; function muteAudio() { var allaudio = document.getElementsByTagName('audio'); if (silence) { for (var j = 0; j < allaudio.length; j++) { allaudio[j].muted = false; } silence = false; } else { for (var j = 0; j < allaudio.length; j++) { allaudio[j].muted = true; } silence = true; } }
January 27, 2015 at 12:42 am #194309chauhanheenaParticipantfunction muteAudio(){ els=document.getElementsByTagName('audio'); for (var j = 0; j < els.length; j++) { els[j].muted = true; } }
din’t work. I changed the selector to ‘a’ too.
@skikkediel
January 27, 2015 at 1:18 am #194311ShikkedielParticipantYou can’t set the volume on a link so that would be natural. Other than that I’m not exactly sure what’s going on. The audio element doesn’t seem to actually be created inside the DOM at least which is why looping through them has no effect. Seems a lot easier to just include it inside the HTML. For sure muting will work then.
Edit – I’ll see if I can put together a workaround, even if my opinion is that creating and loading the audio on every single click isn’t very efficient. I only realise now it’s about the page I’ve seen before by the way. ;-)
January 27, 2015 at 2:08 am #194313ShikkedielParticipantThis works (apart from the link to the mp3) – basic and effective. :-)
Two lines inside the main function :
if (silence) html5audio.muted = true; else html5audio.muted = false;
And a small function that toggles the variable when the button is clicked.
var silence = false; // but preferably true function muteAudio() { silence = !silence; }
January 27, 2015 at 5:37 pm #194389ShikkedielParticipantFound a pretty good solution for this one, @chauhanheena.
January 27, 2015 at 6:42 pm #194392chauhanheenaParticipantI have used the one u suggested and works perrrrfect. Thanks :)
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.