Pergunta

Estou tentando fazer um suspensão de navegação usando jQuery e CSS, e sinto que estou riggando do júri muito além da minha necessidade, mas ainda sou novo no jQuery e não consigo descobrir uma maneira melhor/mais limpa Para fazer isso funcionar ... qualquer insight seria muito apreciado .. (usando o TinyPaste só porque é longo)

http://tinypaste.com/49e96

Nenhuma solução correta

Outras dicas

Você pode reduzir seu código de cores e facilitar a manutenção, isso substituiria todo o código jQuery que você postou:

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)');
});

Você pode ver uma demonstração aqui, embora é claro que as imagens não funcionam :)

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top