Question

这是我的问题：

我有一个图像为灰色的网格，在悬停图像时会变色（图像无法设置为背景图像以供参考）。

当悬停图像时，会出现一个文本，如果我将鼠标悬停在此文本的顶部，图像将停止着色。

为了解决这个问题，我添加了以下Jquery：

  $('.hide').mouseover(function() {
    $('.hide').addClass('test');

       if($('.hide').hasClass('test')){

    $('img.grayscale').addClass('oui');

}


 });

 $('.hide').mouseleave(function() {
    $('.hide').removeClass('test');
    $('img.grayscale').removeClass('oui');

 });

该类oui说着色图像。

img.grayscale.oui {
    filter: none;
    -webkit-filter: grayscale(0%);
}

我遇到的问题是，

当悬停此文本（视图存档）时，它会着色所有网格的图像！它应该只对文本所适合的图像着色。

我试着添加（这个）最近的。当addClass只适用于我点击的动作，但没有成功!!

这怎么可能呢？

你可以看到它或看到完整的代码：

http://codepen.io/anon/pen/KNRBQX

Answer 1

您可以使用$(this)和prev()来选择悬停在元素上的元素的前一个元素（意味着图像）。我希望这会对你有所帮助：

$(this).prev('img.grayscale').addClass('oui');

经过编辑的codepen。

Jquery（这个）最近不工作？

1 个答案: