悬停意愿不工作

Question

我对js并不擅长。我如何得到这个与hoverIntent一起工作？

$(document).ready(function() { 
    $('#nav > li > a').hover(function(){ 
     if ($(this).attr('class') != 'active'){ 
      $('#nav li ul').slideUp(800); 
      $(this).next().slideToggle(800); 
      $('#nav li a').removeClass('active'); 
      $(this).addClass('active'); 
     } 
    }); 
    return false; 
}); 

我已经尝试四处搜寻，但只是不太确定如何去做。它现在基本上在悬停状态下工作。但是如何将.hoverIntent添加到代码中。

This is the Fiddle.

我不能只是改变.hover到.hoverIntent吧？

Answer 1

对于hoverIntend，看到jQuery插件： http://cherne.net/brian/resources/jquery.hoverIntent.html （您只需要下载缩小的版本，并将其导入到应用程序：http://cherne.net/brian/resources/jquery.hoverIntent.minified.js）。

这里的jsfiddle：http://jsfiddle.net/Fmu8Y/1/

另外一个有用的链接：Delay jquery hover event?

$(document).ready(function() { 
    $('#nav > li > a').hoverIntent(function(){ 
    if (!$(this).hasClass('active')){ 
     $('#nav li ul').slideUp(800); 
     $(this).next().slideToggle(800); 
     $('#nav li a').removeClass('active'); 
     $(this).addClass('active'); 
    } 
}, function() { 
    if ($(this).hasClass('active')){ 
     $(this).next().slideUp(800); 
     $(this).removeClass('active'); 
    } 
    }); 
    return false; 
});