Question

我有3个导航按钮，当悬停在上面时，打开下面的菜单。我想在鼠标离开按钮时添加一个计时器，这样它在打开后不会马上关闭。它有点烦人。这是我在jquery中的初始代码，用于打开下拉菜单

$('.info').hover(function () {
    $('.d-skills').show(500);
    $('.d-info').hide(500);
    $('.d-exp').hide(500);
});

如果我在其中添加此代码，则中断并且无效

function(){ t = setTimeout(function(){$('.d-info').hide(500)}, 500;)
}

另外，我添加

var t;

在非常开始，我用'，'。

分隔函数

'd-info'是下拉菜单的类，'info'是按钮类

Answer 1

您可以将handlerOut功能用于hover。

下面是一个简单的片段，演示了这一点并在1.5秒延迟后隐藏了这些部分。

＆＃13;

$('.info').hover(function () {
    $('.d-sections').show(500);
}, function() {
   setTimeout(function() {
     $('.d-sections').hide(500);
   }, 1500);
});

＆＃13;

.d-sections {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="info">
    Hover here for more Information!
    <div class="d-sections">
      <div class="d-skills">
        The D Skills section!
      </div>
      <div class="d-info">
        The D Info section!
      </div>
      <div class="d-exp">
        The D Exp section!
      </div>
    </div>
</div>

＆＃13;

https://jsfiddle.net/32bekom9/1/

添加超时会破坏一切

1 个答案: