背景顏色不變？

所以它改變背景圖像，但不改變背景顏色。無論如何照顧指出我的代碼中的問題？背景顏色不變？

的JavaScript：

$("#menu a").hover(function() { 
    $(this).addClass("hover"); 
}, function() { 
    $(this).removeClass("hover"); 
});

CSS：

.hover { 
    background-color: white; 
    background-position: top center; 
    background-image: url("img/dot.png"); 
    background-repeat: no-repeat; 
    color: red; 
}

來源

2012-02-07 Chris Cates

你需要顯示非懸停默認類。 – 2012-02-07 14:57:42

也許是其他的CSS規則重寫它在頁面上。 – ShankarSangoli 2012-02-07 14:57:51

你不必使用'$ .hover（）';您可以使用'：hover'僞類在純CSS中執行此操作。 – Bojangles 2012-02-07 14:58:11

如上所述......如果你只是添加下面的CSS，它會照顧它。

a:hover { 
    background-color: white; 
    background-position: top center; 
    background-image: url("img/dot.png"); 
    background-repeat: no-repeat; 
    color: red; 
}

：懸停是一個僞CSS類，你可以用它在任何東西，而不需要添加的jQuery/JS來支持它。

來源

2012-02-07 15:03:38 frosty

一個瞎猜：

你需要確保的是，在DOM中存在的節點事件綁定到他們面前。如果你在等待<head>撥打您<script>爲document.ready：

jQuery(function($){ 
    $("#menu a").hover(function() { 
     $(this).addClass("hover"); 
    }, function() { 
     $(this).removeClass("hover"); 
    }); 
});

或者，你可以通過選擇具有higher specificity其他地方重寫background-color財產。如果你定義的樣式，如a:link，a:visited，a:hover，a:focus，或a:active則需要更高的特異性選擇重寫它：

a.hover { 
    /* your styles here */ 
}

你需要提供更多的CSS的我們給你更好的建議。

您可能拼錯一個ID或者以另一個元素與[id="menu"]沒有嵌套的a元素。

來源

2012-02-07 15:03:03 zzzzBov

根據ShankarSangoli的評論，你可能在你的css中有另一個規則覆蓋背景顏色，而這又可能是specificity的問題。

您可以通過稍微改變你的hover功能測試：

$("#menu a").hover(
    function() { 
     //add 'background-color' as an inline css style which will have higher specificity than anything in the css. 
     $(this).addClass("hover").css('background-color', 'white'); 
    }, function() { 
     $(this).removeClass("hover").css('background-color', ''); 
    } 
);

來源

2012-02-07 15:04:29 pete

您的問題是什麼覆蓋您的背景顏色。使用螢火蟲或其他DOM檢查員來查找您的問題。修補程序，讓您的背景顏色很重要，但你應該只使用這個來進行測試：

background-color: black !important;

如果一切正常，你仍然需要找出什麼是覆蓋你的背景。

然後你可以用純CSS做

#menu a:hover { 
    background-color: black; 
    background-position: top center; 
    background-image: url("img/dot_hover.png"); 
    background-repeat: no-repeat; 
    color: red; 
}

來源

2012-02-07 15:09:15 PiTheNumber

背景顏色不變？

回答

相關問題