Question

我有一个带有side类的div和一个带有nav类的ul，当将鼠标悬停在类工具提示上时，我会显示工具提示文本类以及更多li项目的子菜单。我想要实现的是，当我将鼠标悬停在带有类标题的跨度上时，我只需要将壁橱图标类变成白色。表示该当前li中的图标。

"%c"

所以我尝试了

"%s"

所有图标变为白色。我已经看过同级选择器和第一个选择器，但不确定如何实现此行为。

感谢您的帮助。

谢谢

Answer 1

尝试以下代码：

$( "li" ).hover(
 function() {    
$( this ).find("i").css("color", "white");
}, function() {
$( this ).find( "i" ).css("color", "black");
 }
);

Answer 2

在阅读示例html中的问题和评论时，我有些困惑。

我要完成的工作是，当我将鼠标悬停在带有类标题的跨度上时，我只需要将壁橱图标类变成白色即可。

建议您仅在悬停span.header时才希望图标更改颜色。在这种情况下，您可以尝试：

$("span.header").hover(function() {
  $(this).closest("li").find(".fa-alignment").css("color", "white");
}, function() {
  $(this).closest("li").find(".fa-alignment").css("color", "black");
});

<-所以将鼠标悬停在此li上时-此图标需要变为白色

建议将鼠标悬停在li（包括其子项）上时，图标应更改颜色。在这种情况下，请尝试以下操作：

$(".nav > li").hover(function() {    
  $(this).find(".fa-alignment").css("color", "white");
}, function() {
  $(this).find(".fa-alignment" ).css("color", "black");
});

但是最后一个示例可以使用CSS轻松实现：

.nav > li:hover > .fa-alignment {
  color: white;
}

将鼠标悬停在无序列表项上时查找当前图标

2 个答案: