我有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”是按钮类

最佳答案

您可以将handlerOut函数用于hover

下面是一个简单的代码段,演示了此过程,并在1.5秒的延迟后隐藏了这些部分。



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

.d-sections {
  display: none;
}

<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>





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

10-05 20:43
查看更多