volumelider для html5 аудио и видео

Question

Теперь я искал интернет по всему сценарию или помогал создавать слайдер, который одновременно контролирует видео и аудио HTML5. Но, увы, я не нашел такой вещи.

Так что я пришел к вам в надежде, что вы поможете мне с этим маринаде :-)

Проект: Я пытаюсь создать веб-сайт, который предоставляет видео и аудио в то же самое время, но они скрыты , Это suppost, чтобы оставаться в фоновом режиме, поэтому должен быть ползунок громкости, чтобы вы могли настраивать звуки по своему усмотрению.

<div class="hidden">  
<audio id="audio1" autoplay="autoplay" controls="controls" loop><source src="jazz.mp3" /></audio> 
<video id="video1" width="1" height="1" autoplay="autoplay" loop> <source src="fireplace.mp4" type="video/mp4"></video> 
<audio id="audio2" autoplay="autoplay" controls="controls" loop><source src="rain.mp3" /></audio> 
</div> 

Пробовал в начале, чтобы создать сценарий, который превратил музыку вниз на странице загрузки, но не работает

<script language="javascript"> 
var a = document.getElementById('audio1','audio2','video1'); 
a.volume = 0.1; 
</script> 

Answer 1

document.getElementById принимает только один идентификатор в качестве параметра. Смотрите этот ответ другие варианты GetElementByID - Multiple IDs

Ваш код должен работать, если вы пишете так:

var a1 = document.getElementById('audio1'); 
var a2 = document.getElementById('audio2'); 
var v1 = document.getElementById('video1'); 
a1.volume = a2.volume = v1.volume = 0.8;