is it possible to make only one volume control for multiple audio effects?

Sure, you have to loop throught each audio elements. See comments in the code below.

let volumeControl = document.getElementById('vol-control');

function setVolume (){

  // Get the array of audio element and loop through them to set the new volume value
      //  if the input value is "", use zero
      audio.volume = volumeControl.value == "" ? 0 : volumeControl.value / 100;

volumeControl.addEventListener('change', setVolume);
volumeControl.addEventListener('input', setVolume);

// On load
<input id="vol-control" type="number" min="0" max="100" value="25">

<audio src="" id="bgsound1" controls></audio>
<audio src="" id="bgsound2" controls></audio>
<audio src="" id="bgsound3" controls></audio>

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top