真正的凌乱JQUERY

Question

我试图做一个使用jQuery和CSS的导航下拉，我觉得我陪审团索具远远超出我的需要，但我仍然是新来的jquery，并不能完全图出了更好/更清洁的方式来得到这个工作...任何有识之士将不胜感激。（使用tinypaste只是导致它的长）

http://tinypaste.com/49e96

Answer 1

你可以缩短你的颜色代码下来，使之成为比较容易维护，这会取代您发布的所有jQuery代码：

var colors = { 
    "home":"#43b1cc", 
    "transport":"#f6e572", 
    "landdev":"#fda882", 
    "environment":"#b6e578" 
}; 

$('#nav > li').hover(function() { 
    var color = colors[$(this).attr("id")]; 
    if (color) $(this).parent().css('background-color', color); 
}, function(){ 
    $(this).parent().css('background-color', '#000'); 
}); 

$('#nav #transport ul').hover(function() { 
    $(this).prev('a').css('backgroundImage', 'url(images/nav_transport_on.png)'); 
}, function(){ 
    $(this).prev('a').css('backgroundImage', 'url(images/nav_transport_off.png)'); 
}); 

You can see a demo here，虽然当然图像不会工作:)