VolKTieR,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
body{
height: 2000px;
background-color: #D3D3D3;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<audio id="audio">
<source src="audio/1.mp3" type="audio/mpeg">
</audio>
<div class="fixedbut" id="sebut">Звук</div>
<style>
div.fixedbut {
position: fixed;
bottom: 93%;
right: 20px;
display: none;
background: white;
border-radius: 10px;
color: black;
text-decoration: none;
padding: 6px 23px;
font-size: 17px ;
-webkit-transition: 0.33s all ease-out;
-o-transition: 0.33s all ease-out;
transition: 0.33s all ease-out;
z-index: 999; }
div.fixedbut:hover {
background: grey;
color: white; }
</style>
<script>
document.getElementById("sebut").onclick = function()
{
var myaudio = document.getElementById("audio");
if(myaudio.paused == true)
{
document.getElementById("audio").play();
}
else if (myaudio.paused == false)
{
document.getElementById("audio").pause();
}
}
</script>
<script>
$(document).ready(function(){
$(window).scroll(function () {
var vis = $('div.fixedbut').is(':visible');
if ($(this).scrollTop() >= 200 && !vis)
{
$('div.fixedbut').stop(true,true).fadeIn();
}
else if($(this).scrollTop() < 200 && vis )
{
$('div.fixedbut').stop(true,true).fadeOut();
}
}).trigger('scroll');
});
</script>
</body>
</html>