Skip to content

Instantly share code, notes, and snippets.

@Bijesse
Created March 24, 2015 16:23
Show Gist options
  • Save Bijesse/e3925c5faf55acb844cd to your computer and use it in GitHub Desktop.
Save Bijesse/e3925c5faf55acb844cd to your computer and use it in GitHub Desktop.
JS Bin // source http://jsbin.com/qacezoqovi
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
<style id="jsbin-css">
#btn-mute{
border-radius:2px;
color:white;
background-color:#222;
border:1px solid red;
padding: 8px 10px 5px 10px;
margin:10px;
cursor:pointer;
}
#btn-mute.active::before{
content:'Sound ON'
}
#btn-mute::before{
content:'Sound OFF';
}
</style>
</head>
<body>
<div class="container">
<audio id="sound1" src="http://www.stephaniequinn.com/Music/Allegro%20from%20Duet%20in%20C%20Major.mp3"></audio>
<a id="btn-mute"></a>
</div>
<script id="jsbin-javascript">
var mute = false;
$(document).keydown(function(e){
if (e.keyCode == 37) { document.getElementById('sound1').play();
return false;
}
});
$("#btn-mute").click(function(){
$(this).toggleClass('active');
if(mute){
unMuteAllSounds();
} else {
muteAllSounds();
}
});
function muteAllSounds(){
$("audio").each(function(i,obj){
obj.volume = 0;
});
mute = true;
}
function unMuteAllSounds(){
$("audio").each(function(i,obj){
obj.volume = 1;
});
mute = false;
}
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-2.1.1.min.js"><\/script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div class="container">
<audio id="sound1" src="http://www.stephaniequinn.com/Music/Allegro%20from%20Duet%20in%20C%20Major.mp3"></audio>
<a id="btn-mute"></a>
</div>
</body>
</html></script>
<script id="jsbin-source-css" type="text/css">#btn-mute{
border-radius:2px;
color:white;
background-color:#222;
border:1px solid red;
padding: 8px 10px 5px 10px;
margin:10px;
cursor:pointer;
}
#btn-mute.active::before{
content:'Sound ON'
}
#btn-mute::before{
content:'Sound OFF';
}
</script>
<script id="jsbin-source-javascript" type="text/javascript">var mute = false;
$(document).keydown(function(e){
if (e.keyCode == 37) { document.getElementById('sound1').play();
return false;
}
});
$("#btn-mute").click(function(){
$(this).toggleClass('active');
if(mute){
unMuteAllSounds();
} else {
muteAllSounds();
}
});
function muteAllSounds(){
$("audio").each(function(i,obj){
obj.volume = 0;
});
mute = true;
}
function unMuteAllSounds(){
$("audio").each(function(i,obj){
obj.volume = 1;
});
mute = false;
}
</script></body>
</html>
#btn-mute{
border-radius:2px;
color:white;
background-color:#222;
border:1px solid red;
padding: 8px 10px 5px 10px;
margin:10px;
cursor:pointer;
}
#btn-mute.active::before{
content:'Sound ON'
}
#btn-mute::before{
content:'Sound OFF';
}
var mute = false;
$(document).keydown(function(e){
if (e.keyCode == 37) { document.getElementById('sound1').play();
return false;
}
});
$("#btn-mute").click(function(){
$(this).toggleClass('active');
if(mute){
unMuteAllSounds();
} else {
muteAllSounds();
}
});
function muteAllSounds(){
$("audio").each(function(i,obj){
obj.volume = 0;
});
mute = true;
}
function unMuteAllSounds(){
$("audio").each(function(i,obj){
obj.volume = 1;
});
mute = false;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment