HTML5 Video // Completely Hide Controls

在HTML5页面中播放视频video，如何隐藏显示控件的按钮。

Like this:

    <video width="300" height="200" autoplay="autoplay">  <source src="video/supercoolvideo.mp4" type="video/mp4" /></video>

controls is a boolean attribute:

注意：布尔值不允许使用值“true”和“false”属性。要表示假值，属性必须为完全省略。

HTML5 video – show/hide controls programmatically

    <video id="myvideo">  
    <source src="path/to/movie.mp4" /></video>
    <p onclick="toggleControls();">Toggle</p>
    <script>
    var video = document.getElementById("myvideo");
    function toggleControls() {  
      if (video.hasAttribute("controls")) {    
        video.removeAttribute("controls")    
      } else {     
        video.setAttribute("controls","controls")     
      }
    }
    </script>

如何删除HTML5视频播放器导航按钮

您可以通过Javascript禁用控件：

    document.getElementById('video-player').controls = false

Or simply remove controls attribute:

    <video id='video-player' autoplay="autoplay" loop preload="metadata">    <source src="Video/1.MP4" type="video/mp4"></video>

隐藏视频控件，直到用户悬停在视频上

我们可以通过jQuery的几行代码实现这一点, making use of .hover():

$('#myvideo').hover(function toggleControls() {  
if (video.hasAttribute("controls")) {  
    video.removeAttribute("controls")  
} else {  
    video.setAttribute("controls", "controls")  
}  
}) 

编辑我错误地将变量“video”留在了上面的代码中。我将其更改为“this”，这样您就不必管理获取ID的变量。

    $('#myvideo').hover(function toggleControls() {    
    if (this.hasAttribute("controls")) {        
        this.removeAttribute("controls")   
    } else {       
        this.setAttribute("controls", "controls")    
    }})

HTML

    <video width="300" height="auto" id="myvideo">    <source src="#" type="video/mp4" /></video>

Update:
你提到你有几个视频。因此，您可以使用相同的逻辑，只需在“$（）”中添加额外的选择器。下面是一个示例：

    $('#yourID1, #yourID2, #yourID3').hover(function toggleControls() { ...

这样做会_listen_或等待，直到它检测到您悬停在其中一个ID上。

我们如何从视频标签中隐藏播放、时间线控制

To show video controls:

    <video width="320" height="240" controls>

To hide video controls:

    <video width="320" height="240">

Supported from IE 9 and up.

html如何删除iframe中视频标记中的控制栏

hi just check your video code if there is anycontrols

word like that

    <video src="../videos/test.mp4" autoplay controls></video>

then remove it to be like that

    <video src="../videos/test.mp4" autoplay ></video>