运行jquery函数后,CSS悬停效果不起作用

Question

Here is my css:

.parentDiv {
}

.childDiv {
    height:40px;
    width:165px;
    color:#D6D6D6;
    text-align:left;
    cursor:pointer;
    font-size:.85em;
    font-weight:normal;
    border-top:1px solid #0F0F0F;
}

.childDiv:hover{
    background:#2B2B2B;
}

这是我的jquery:

<script type="text/javascript">

    $('.childDiv').click(function(){
        $(this)
            .css('background-color','#4F94CD')
            .siblings()
            .css('background-color','black');
    });

</script>

class childDiv的div悬停效果完美.但是,一旦我运行上面的jquery函数,CSS悬停效果似乎不再起作用.在运行此jquery函数后,我仍然可以使用悬停效果,我试图寻找一个jquery替代悬停效果,但没有一个完美地工作.如果有人知道如何解决这个问题,将非常感谢帮助,谢谢!

Answer 1

这听起来并不奇怪......尝试在悬停背景上设置!important,如下所示:

.childDiv:hover {
  background: #2b2b2b !important;
}