我希望将鼠标悬停在子导航中的列表项上,以激活页面上该类别中所有项的类(不仅仅是父元素或同级元素)。有任何想法吗?这是我的意思的一个例子:
<style>
img.BLUE {border:1px solid #FFF}
</style>
<ul id="subnav">
<li id="BLUE">Blue</li> <!--When hovering these...-->
<li id="PINK">Pink</li>
<li id="YELLOW">Yellow</li>
</ul>
<!--other stuff here-->
<img class="BLUE" href="image.jpg"> <!--it applies the border to this and any other img.blue on the page-->
<img class="PINK" href="image1.jpg">
<img class="YELLOW" href="image2.jpg">
最佳答案
这应该做你想做的..
<style type="text/css">
img.active{border:1px solid #FFF;}
</style>
和
$('#subnav li').hover(function(){
$('.' + this.id).addClass('active');
},function(){
$('.' + this.id).removeClass('active');
});
关于javascript - 将鼠标悬停在一个类(class)上会影响页面上同一类(class)的所有其他类(class),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7312880/