在想要的时间之后移除视频悬停控件

Question

此视频显示悬停时的控件，并在光标结束时隐藏它们。我怎么能保持相同的行为，但只有在经过一段时间（3秒）后才删除控件..？

$('#video').hover(function toggleControls() {
  if (this.hasAttribute("controls")) {
    /* setTimeout(function() {
    this.removeAttribute("controls")
    }, 3000)*/
    this.removeAttribute("controls")
  } else {
    this.setAttribute("controls", "controls")
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<video width="30%" id="video">
  <source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
    </video>

Answer 1

关闭默认面板。并建立自己的完全控制权。 根据我的经验，更改在所有浏览器/设备中都无法正常工作。