如何做多个悬停在列表上 [英] How To Do Multiple Hover On List

问题描述

好，所以我想知道如何在悬停时选择多个项目，例如当我悬停在列表上 a 突出显示 a 和列表 b ，给出列表框阴影。

Alright so i wanted to know how i can select multiple items on hover for example when i hover on list a Highlight a and on list b, give that list box shadow. ive tried to code it but for some reason im not able to do the multiple hover effect.

CSS代码：

#a:hover ~ #b {
    background: #ccc
}

HTML代码：

<div><ul id="a"><li>Div A</li></ul></div>
<div>random elements</div>
<div>random elements</div>
<div>random elements</div>
<div><ul id="b"><li>Div B</li></ul></div>

推荐答案

这是我使用的jquery

This is the jquery I have used

$('#a').hover(function(){
  $('#a').css('background','#ccc');
  $('#b').css('background','#ccc');
}, function(){
  $('#a').css('background','#fff');  // Background of #a by default 
  $('#b').css('background','#fff');  // Background of #b by default 
})

$('#b').hover(function(){
  $('#a').css('background','#ccc');
  $('#b').css('background','#ccc');
}, function(){
  $('#a').css('background','#fff');  // Background of #a by default 
  $('#b').css('background','#fff');  // Background of #b by default 
})

如果您要更改#a或#b，
指定我所提到的地方的颜色。简单：）

If you are changing the background of #a or #b, specify the color to the places I had mentioned too. Simple :)

这篇关于如何做多个悬停在列表上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！