使用jquery更改menue的背景顏色

Question

我正在嘗試用Zenphoto建立一個照片庫。 他們使用PHP，可以添加這樣的自定義菜單：

    <div id="navmenu">
    <?php printCustomMenu('main_menue'); ?>
    </div>

我改變了sylesheet中整個事物的外觀，看起來像這樣：

#navmenu {
        width: 1000px;
        height: 42px;
        margin: 0px auto 30px auto;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        text-align: left;
        font-size: 21px;
        background-color: #000000
        }

#navmenu li {
        display: inline; 
        }

#navmenu a {
        color: #eee;
        display: inline;
        line-height: 2em;
        padding: 0.375em 0.5em;
        text-decoration: none;
            }

#navmenu a:hover {
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 21px;
        color: #000000;
        background-color: #ffff33;
        padding: 0.375em 0.5em;
            }

現在我想更改各個菜單項的背景顏色，以便每個菜單項都有自己的顏色。 隨機與否我不在乎。 我創建了一個正確連接的js文件。

我已經嘗試了幾個代碼，但沒有任何作用。 現在我試着這樣做，看看我是否可以改變顏色：

 $(document).ready(function() {

 $("navmenu").hover(function(){
  $(this).css('background-color', '#eeeeee')
 });
});

不行。 我是所有這些編程的新手，我將非常感謝任何幫助。 如果你能回答傻瓜，那將是非常好的，這樣我才能理解。

Answer 1

使用：

$("#navmenu").hover(function(){

你錯過了ID #選擇器。

Answer 2

您需要使用＃為ID或a正確地處理div。 對於一個類：

$(document).ready(function() {

$("#navmenu").hover(function(){
  $(this).css('background-color', '#eeeeee')
 });
});

初學者的提示：如果你沒有得到你期望的結果，你可以通過在這樣的地方拋出控制台日志消息來驗證是否正在調用該函數：

$(document).ready(function() {
    console.log("document ready!");
    $("#navmenu").hover(function(){
        console.log("hover activated");
        $(this).css('background-color', '#eeeeee')
    });
});

Answer 3

你可以嘗試這樣的東西，因為它會在hover時選擇一個random color並切換回hover out事件的#EEE背景：

jQuery的：

$(function () {
    $("#navmenu a").hover(function () {
        var newColor = Math.floor(Math.random() * 16777215).toString(16);
        $(this).css('background-color', '#' + newColor);
    }, function () {
        $(this).css('background-color', '#EEE')        
    });
});​

工作示例： http ： //jsfiddle.net/Qc4R7/