Javascript 仅使用jQuery对当前元素执行悬停

我对JS有点陌生。当我悬停时，它会影响所有项目，我可以看到为什么，但不确定如何仅针对当前悬停的项目

有什么想法吗

$('.member').hover(function() {
    var $this = $(this);
      $('.member-icon i').fadeIn('slow');
    },
    function(){
      $('.member-icon i').fadeOut('slow');
    }
 );

HTML

这应该行得通

$('.member').hover(function() {
    var $this = $(this);
      $this.find('.member-icon i').fadeIn('slow');  // .member-icon inside $this
    },
    function(){
      $this.find('.member-icon i').fadeOut('slow');
    }
 );

这应该行得通

$('.member').hover(function() {
    var $this = $(this);
      $this.find('.member-icon i').fadeIn('slow');  // .member-icon inside $this
    },
    function(){
      $this.find('.member-icon i').fadeOut('slow');
    }
 );

您需要使用

$（this）

（您似乎已经开始使用）来引用特定的元素，而不是将选择多个元素的类

$('.member').hover(function() {
        $(this).find('.member-icon i').fadeIn('slow');
    },
    function(){
        $(this).find('.member-icon i').fadeOut('slow');
    }
);

您需要使用

$（this）

（您似乎已经开始使用）来引用特定元素，而不是将选择多个元素的类

$('.member').hover(function() {
        $(this).find('.member-icon i').fadeIn('slow');
    },
    function(){
        $(this).find('.member-icon i').fadeOut('slow');
    }
);

---

这不需要javascript

.member .member-icon i {
    opacity: 0;
    transition: opacity 1s;
}
.member:hover .member-icon i {
    opacity: 1
}

---

您不需要javascript来完成此操作

.member .member-icon i {
    opacity: 0;
    transition: opacity 1s;
}
.member:hover .member-icon i {
    opacity: 1
}

---

既然@j08691已经有了正确的jQuery解决方案，我将发布一个替代的CSS专用解决方案：

使用过渡缓进和缓出

成员

，悬停使

i

元素不透明度为1（显示），默认为0（隐藏）

。成员i{
显示：内联块；
不透明度：0；
-webkit过渡：不透明度0.5s缓进缓出；
-moz过渡：不透明度0.5s缓进缓出；
-ms转换：不透明度0.5s缓进缓出；
-o型过渡：不透明度0.5s缓进缓出；
}
.成员：hover i{
不透明度：1；
}

---

既然@j08691已经有了正确的jQuery解决方案，我将发布一个替代的CSS专用解决方案：

使用过渡缓进和缓出

成员

，悬停使

i

元素不透明度为1（显示），默认为0（隐藏）

。成员i{
显示：内联块；
不透明度：0；
-webkit过渡：不透明度0.5s缓进缓出；
-moz过渡：不透明度0.5s缓进缓出；
-ms转换：不透明度0.5s缓进缓出；
-o型过渡：不透明度0.5s缓进缓出；
}
.成员：hover i{
不透明度：1；
}

---

我想您正在寻找：

$（'.member'）。悬停（函数（）{
$（this.find（'.member icon i'）.fadeIn（'slow'）；
}，函数（）{
$（this）.find（'.member icon i'）.fadeOut（'slow'）；
});

---

我想您正在寻找：

$（'.member'）。悬停（函数（）{
$（this.find（'.member icon i'）.fadeIn（'slow'）；
}，函数（）{
$（this）.find（'.member icon i'）.fadeOut（'slow'）；
});

你能提供你的HTML结构吗？是的，现在为你添加这是一个例子：你能提供你的HTML结构吗？是的，现在为你添加这是一个例子：