Question

以下代码允许我在悬停时显示垂直菜单，但一旦鼠标输出事件立即消失。我不是一个程序员，我所做的只是随处可用的代码，但请。

if($(columnElement).length 
        && $(window).width() >= maxWindowSize) {          
    showOrHideSliderBarMenu(columnElement, menuElement, 1);
}

$(".float-vertical-button").hover(function(){   
   var numberToUse = $(menuElement).hasClass('active') ? 0 : 1;
   showOrHideSliderBarMenu(columnElement, menuElement, numberToUse);
});

Answer 1

您总是可以将逻辑包装在setTimeout（）函数中。

 setTimeout(function(){
    $c('hide!');
    hideUnderConstruction();
  }, 500);
}

Answer 2

if($(columnElement).length && $(window).width()>=maxWindowSize) 
    showOrHideSliderBarMenu(columnElement, menuElement, 1);
$(".float-vertical-button").hover(function(){   
    if($(menuElement).hasClass('active')) setTimeout(showOrHideSliderBarMenu(columnElement, menuElement, 0), 1000);
    else showOrHideSliderBarMenu(columnElement, menuElement, 1);
});

其中1000是您希望延迟的时间（以毫秒为单位）

Answer 3

jQuery的.hover()实际上是两个链接在一起的事件。（mouseenter和mouseleave）。您应该单独指定它们。 E.g：

$( ".float-vertical-button" ).hover(

  //Mouse enter handler
  function() {
    showOrHideSliderBarMenu(columnElement, menuElement, 1);
  }, 

  //Mouse leave handler
  function() {
    setTimeout(function(){
        showOrHideSliderBarMenu(columnElement, menuElement, 0);
    }, 500);
  }
);

http://api.jquery.com/hover/

如何在jQuery中延迟mouseout事件

3 个答案: