jquery - 鼠标悬停和 addClass jQuery 示例

Question

这是给任何了解 jQuery 的人的礼物:

我有一个导航<ul class="nav">我想换个地方。我基本上是在寻找 a:hover效果，只是淡入(我正在使用 Sprite ，从一个 Sprite 区域到下一个 Sprite 区域)。

我的标题中的代码如下所示:

$(document).ready(function(){
  $(".nav li").mouseover(function(){
    addClass('hovered');
  });
});

在我对 jQuery 的理解中，这表示“文档准备就绪后，监听所有 .nav li 元素上的鼠标悬停事件。当您听到时，向其添加一个“悬停”类。这就是我想要的已经发生，但现在 - 什么都没有 - 正在发生。

最终我会添加动画和 mouseOut，但我希望能够让这部分按我想要的方式工作。谢谢!

Answer 1

您正在寻找悬停(http://api.jquery.com/hover/)，并且您需要使用 $(this) 定位您的 LI:

$(document).ready(function(){
  $(".nav li").hover(function(){
    $(this).addClass('hovered');
  }, function(){
    $(this).removeClass('hovered');
 });
});