[英]Set Default Volume in script
I have a website that loops music on load, but it is too loud. 我有一个网站可在加载音乐时循环播放音乐,但声音太大。 I have a slider bar to change the music volume, but how would I default it to 25% of the slider? 我有一个滑杆来更改音乐音量,但是如何将其默认设置为滑杆的25%?
<audio id=music loop autoplay src="peep.mp3">
<p>If you are reading this, it is because your browser does not support the audio element.</p>
</audio>
<input id="vol-control" type="range" min="0" max="100" step="1" oninput="SetVolume(this.value)" onchange="SetVolume(this.value)"></input>
<script>
function SetVolume(val)
{
var player = document.getElementById('music');
console.log('Before: ' + player.volume);
player.volume = val / 100;
console.log('After: ' + player.volume);
}
</script>
Just create a script that set the volume: 只需创建一个设置音量的脚本即可:
var audio = document.getElementById("music");
audio.volume = 0.25;
If you are using the audio
tags, just get the DOM Node in Javascript and manipulate the volume
property 如果您正在使用audio
标签,则只需获取Java脚本中的DOM节点并操纵volume
属性
var audio = document.querySelector('audio');
// Getting
console.log(volume); // 1
// Setting
audio.volume = 0.5; // Reduce the Volume by Half
The number that you set should be in the range 0.0
to 1.0
, where 0.0
is the quietest and 1.0
is the loudest. 您设置的数字应在0.0
到1.0
的范围内,其中0.0
是最安静的,而1.0
是最大的。
input
is a Void element and as such does not needs a closing </input>
input
是一个Void元素,因此不需要结束</input>
max
, min
, well, use also value
. 您正在使用max
, min
,也要使用value
。 setVolume()
像setVolume()
一样初始化您的函数 setVolume
instead of PascalCase SetVolume
, since it's a normal function, not a Method, Class or constructor... 使用camelCase setVolume
而不是PascalCase SetVolume
,因为它是常规函数,而不是Method,Class或构造函数... const audio = document.getElementById('audio'), input = document.getElementById('volume'), setVolume = () => audio.volume = input.value / 100; input.addEventListener("input", setVolume); setVolume();
<audio id=audio loop autoplay src="//upload.wikimedia.org/wikipedia/en/4/45/ACDC_-_Back_In_Black-sample.ogg">Audio is not supported on your browser. Update it.</audio> <input id=volume type=range min=0 max=100 value=25 step=1>
I think you'd also like this example . 我想你也会喜欢这个例子 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.