首页 > 解决方案 > 带音频的 HTML5 视频无法控制音量

问题描述

我通过像这段代码一样将音频与视频分开来使用html5的视频标签。

<video id="myvideo" controls >
  <source src="output.webm" type="video/webm">
    <audio id="myaudio" controls="">
        <source src="audio1.ogg" type="audio/ogg"/>
    </audio>
</video>

<script>
    var myvideo = document.getElementById("myvideo");
    var myaudio = document.getElementById("myaudio");

    var change_time_state = true;

    myvideo.onplay = function(){
        myaudio.play();
        if(change_time_state){
            myaudio.currentTime = myvideo.currentTime;
            change_time_state = false;
        }
    }

    myvideo.onpause = function(){
        myaudio.pause();
        change_time_state = true;
    }
</script>

它可以播放视频和音频,但不能改变音量。我可以修复它以更改音量吗?

标签: javascripthtmlhtml5-videohtml5-audio

解决方案


您可能正在搜索 DOM 卷属性,请在w3school中查看

在您的情况下,解决方案是:

myaudio.volume = anynumber;

必须是介于 0.0 和 1.0 之间的数字。

示例值:

1.0 是最高音量(100%。这是默认值)

0.5 是一半体积 (50%)

0.0 为静音(与静音相同)


推荐阅读