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;
});

悬停意图不起作用

1 个答案: