jquery - 鼠标悬停时更改 .gif

Question

我有一个菜单，其中包含位于中心的动画 Logo 链接和内部的 2 个跨度。

当鼠标悬停在div“.menu”上时，.gif 会在开头发生变化。然后，在鼠标移开时，同一 div 的图像再次发生变化。

但是我有一个问题:我想要的是，当用户将光标放在“.menu”上时，每个菜单项的 gif 也会发生变化，位于菜单上父链接的开头。

我不希望 .gif 在菜单中发生更改!

<强> DEMO IN FIDDLE

$(".menu")
.mouseover(function() {   
    $(".logo img").attr("src", "http://www.makingdifferent.com/wp-content/uploads/2013/03/123.gif");  
});

$(".menu").mouseout(function() {   
    $(".logo img").attr("src", "http://www.thisiscolossal.com/wp-content/uploads/2012/07/rrrrroll01.gif");  
    });

Answer 1

将.mouseover更改为.mouseenter，并将.mouseout更改为.mouseleave。

查看 fiddle

$(".menu")
.mouseenter(function() {   
    $(".logo img").attr("src", "http://www.makingdifferent.com/wp-content/uploads/2013/03/123.gif");  
});

$(".menu").mouseleave(function() {   
    $(".logo img").attr("src", "http://www.thisiscolossal.com/wp-content/uploads/2012/07/rrrrroll01.gif");  
    });