Question

您好我的CSS文件中有此代码

.topnav > li:hover:not(.active) > a {
    background: #3e3e3e;
 }

我想通过javascript实现这一目标。有人可以帮我解决一下这个问题吗？

Answer 1

假设您正在谈论直接转换为javascript，您可以执行以下操作（在jQuery中）;

$("li").not("active").children("a").hover(function(){
    $(this).css({'background' : '#3e3e3e'});
}, function(){
    $(this).css({'background' : 'youroldcolor'});
});

这与你的css选择器完全一样，首先查看li，忽略具有活动类的选择器，然后选择'a'子项。（this）的使用是指目标元素。

修改

更新以修复代码问题。

Answer 2

您的HTML

<ul class="topnav">
<li onmouseover="StartHover()" onmouseout="OutHover()">aaaaaa</li>
</ul>

您的Javascript

  <script>
    function StartHover() {
        $(".topnav li").css("background", "#3e3e3e");
    }
    function OutHover() {
        $(".topnav li").css("background", "White");
    }

</script>

如何用Javascript更改悬停样式？

2 个答案:

修改