Question

我正在尝试使用Jquery更改悬停时文本的颜色。我认为我的代码是正确的，但它现在正在运行。这是我的JQuery代码：

$(document).ready(function() {
    $('#menu li a').hover(function() {
       $(this).css('color','#ffffff');
    }, function() {
       $(this).css('color', '#97A59E');
    });
});

我的css：

#menu li a 
{
color:#97A59E !important;
background-color:#3e4347 !important;
display: block;
float: left;
line-height:2.25em!important;
text-align:center;
width:300px;
}

和我的网站母版页：

    <ul id="menu">
    <li><a id="nav-home" href="<%= Url.Action("Index", "Home") %>">Home</a></li>
    <li><a id="nav-about" href="<%= Url.Action("About","Home") %>">About</a></li> 
    </ul>

有什么想法吗？谢谢。

Answer 1

我不知道JQuery是否是正确的方法。你有没有尝试过css

#menu li a { color: #97A59E}
#menu li a:hover { color: #ffffff}

Answer 2

在CSS中，您使用！important设置颜色。这将使它优先于任何没有！important的东西。再次尝试使用代码，但在颜色之后使用！important。即：

$(document).ready(function() {
    $('#menu li a').hover(function() {
       $(this).css('color','#ffffff !important');
    }, function() {
       $(this).css('color', '#97A59E !important');
    });
});

我应该补充一点，如果你能够使用纯CSS解决方案，那么Sjobe的答案可能会更好。知道为什么某些东西无论如何都不起作用仍然很好。：）

Answer 3

color:#97A59E !important;

从!important定义

中删除css部分

JQuery更改文本颜色

3 个答案: