Question

我想使用HTML5视频标签，但在这种情况下，我想只有音量控制......请帮我

<video controls id="myMovie" width="600" height="600" loop preload="auto" > 
<source src="any file.mp4" type='video/mp4' /> 

<source src="any file.mp4" type='video/mp4' />   
     Your browser does not support the video tag. 
</video> 

Answer 1

我不知道你是否能有选择地隐藏控件，但有办法做到这一点。

您可以通过从视频元素中删除controls属性来隐藏所有控件。

演示在这里：http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_video_js_prop

然后，您可以使用自己的按钮来增加或使用JavaScript降低音量。你可以在这里的示例代码：

https://msdn.microsoft.com/en-us/library/ie/hh924823%28v=vs.85%29.aspx

JS：

// volume buttons 
document.getElementById("volDn").addEventListener("click", function() { 
    setVol(-.1); // down by 10% 
}, false); 
document.getElementById("volUp").addEventListener("click", function() { 
    setVol(.1); // up by 10% 
}, false); 


// change volume based on incoming value 
    function setVol(value) { 
     var vol = video.volume; 
     vol += value; 
     // test for range 0 - 1 to avoid exceptions 
     if (vol >= 0 && vol <= 1) { 
      // if valid value, use it 
      video.volume = vol; 
     } else { 
      // otherwise substitute a 0 or 1 
      video.volume = (vol < 0) ? 0 : 1;       
     } 
    }