JavaScript injection for controlling volume of video

Question

I have a sample html page here which displays a video, I am using javascript injection to play/pause the video. But now I want to control the volume as well. How do I create a function which decreases/increases the volume based on percentage?

html video - http://techslides.com/demos/sample-videos/small.webm

JavaScript

function pausevid() {         
  var video = document.getElementsByTagName('video');     
  video[0].pause();  
}  

pausevid();

Answer 1

I don't think you could directly using percentage to video.volume property.

You could use parseFloat to remove the % sign and divide by 100 to change it to decimal.

let vol = "80%"

function pausevid() {
  var video = document.getElementsByTagName('video');
  video[0].pause();
  video[0].volume = parseFloat(vol) / 100;
  console.log(parseFloat(vol) / 100)
}

pausevid();

<video></video>

Answer 2

You may have to try this: https://www.w3schools.com/tags/av_prop_volume.asp

Set your volume for example to 20%

var vid = document.getElementById("myVideo");
vid.volume = 0.2;