隐藏(不删除)HTML5视频控件

^{视频测试文件:http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4}

如果您播放上述视频,并在不移动光标的情况下单独播放,则控件将消失.如果再次移动光标,它们将再次出现.他们也会在暂停或视频整理时出现.

非常像流行的原生或桌面视频播放器.

这就是我要的.我希望隐藏控件的方式与他们在视频播放时自动隐藏的方式相同,并且光标没有移动一段时间.

有没有办法实现这一点,而无需完全删除控件？

试试这个:

$("#myvideo").hover(function() {
  $(this).prop("controls", true);
}, function() {
  $(this).prop("controls", false);

});

// if always hide

$("#myvideo2").click(function() {
 if( this.paused)
   this.play();
  else
    this.pause();
});

All time hide controls: