如果按下任何按钮，则自动隐藏div

Question

我正在制作自己的视频播放器，顶部是一个信息div，底部是一个播放栏div。

如果按下任何按钮，这些条应在5秒钟内消失，如果您按下按钮，则这些条应出现（如果已隐藏）或停留5秒钟以上。

起初我以为是这样

  document.onkeyup = function(event) {
    showBar('playbarDiv');
    showBar('infoDiv');

    setTimeout(function() {
     hideBar(); 
    }, 5000);

    if (hideCounter !== 1){
     focusOn('playButton');
     hideCounter = 1;
    }

   };

但是当然，每次按下按钮时，都会向队列添加setTimeOut函数，因此5秒钟后，条形开始隐藏和显示。

当我按下按钮而不是“加载”新内容时，我需要使用“重新启动” SetTimeOut之类的方法来避免这种情况。

这是一个简单的示例： 演示

这可能吗？ 还是我需要使用与setTimeOut不同的东西？

提前致谢。

Answer 1

是的，有可能，您可以使用window.clearTimeout(yourTimeOutVariable)清除以前的超时。 检查您的演示，更新

您可以在这里http://www.w3schools.com/jsref/met_win_cleartimeout.asp阅读更多有关它的信息。

Answer 2

尝试这个：

    jQuery(document).ready(function(){
  document.onkeyup = function(event) {

    if($("#content").not(":visible")){
        $("#content").fadeIn(500);
                setTimeout(function() { $("#content").fadeOut(500); }, 5000);

     };

  };
});