Code:
Code:
<body>
<audio src="" id="audioPlayer">
Error: You have a trash browser, git gud.
</audio>
<ul volume="0.00005" id="playlist">
<li class="current-song"><a href="files/redroses.mp3"></a></li>
<li><a href="files/nowadays.mp3"></a></li>
<li><a href="files/psycho.mp3"></a></li>
</ul>
<script src="https://code.jquery.com/jquery-2.2.0.js"></script>
<script src="files/js/audioPlayer.js"></script>
<script>
// loads the audio player
audioPlayer();
</script>
<input id="vol-control" class="center" type="range" min="0" max="100" step="1" oninput="SetVolume(this.value)" onchange="SetVolume(this.value)"></input>
<style>
.container {
position: relative;
}
.center {
position: absolute;
left: 0;
top: 50%;
width: 100%;
text-align: center;
font-size: 18px;
}
img {
width: 100%;
height: auto;
opacity: 0.3;
}
</style>
<script>
var video = document.getElementById('video');
var volumeControl = document.getElementById('vol-control');
var setVolume = function() { video.volume = this.value / 100; };
volumeControl.addEventListener('change', setVolumne);
volumeControl.addEventListener('input', setVolumne);
</script>
<script src="files/js/volcontrol.js"></script>
</body>
EDIT: Now it's sliding properly after disabling some js files interfering with it but it doesn't affect the volume now.