HTML5 Video volume control

by Alvin Olavarrieta

HTML

<video id="video" autoplay>
    <source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
</video>
<br/>
<input id="vol-control" type="range" min="0" max="100" step="1" oninput="SetVolume(this.value)" onchange="SetVolume(this.value)"></input>

JavaScript

window.SetVolume = function(val)
{
    var player = document.getElementById('video');
    console.log('Before: ' + player.volume);
    player.volume = val / 100;
    console.log('After: ' + player.volume);
}