0

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();
Programmer
  • 39
  • 5
  • In the interest of content quality, duplicate questions aren't permitted. Please research your inquiry before posting in accordance with [ask]. This is a duplicate of [Is there a way to set the default HTML5-Video volume?](https://stackoverflow.com/questions/7582385/is-there-a-way-to-set-the-default-html5-video-volume) – esqew Jan 12 '22 at 12:31
  • @esqew it is not a duplicate since I am using js injections compared to the link you posted. Also trying to use percentage instead of a floating number. – Programmer Jan 12 '22 at 12:32

2 Answers2

2

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>
James
  • 2,732
  • 2
  • 5
  • 28
0

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;

DevChris
  • 41
  • 7
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jan 12 '22 at 13:08