淡入淡出的图像

Question

我有一张图像被分成9个图像分成多个div。

我想实现对3组切片图像的淡化焦点。一旦我将鼠标输入到一组图像中，另一组图像将会消失。

当我将鼠标悬停在同一组内的图像上时，会出现问题，其他图像会闪烁。任何人都可以帮助我了解如何检测我是否仍在同一组图像中。

$(".group1").mouseenter(function(){ 
    $(".group2, .group3").fadeTo("slow",.5); 
}).mouseout(function(){ 
    $(".group1, .group2, .group3").fadeTo("slow",1); 
}); 

Answer 1

由于group1是班级，我假设您已将其授予您的三个师。每当鼠标离开任何一个分区时，鼠标输出事件都会发生，即使它直接进入另一个group1 div（就像你希望的那样）。

我认为最简单的解决办法是包装在一个外层div每个组和绑定到那些：

$("#group1Wrapper").mouseenter(function(){ 
    $(".group2, .group3").fadeTo("slow",.5); 
}).mouseout(function(){ 
    $(".group1, .group2, .group3").fadeTo("slow",1); 
});