Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Mais de 10 postagens
Mais de 10 postagens
Tópico Autor
Mensagens: 22
Nome: Ricardo
Sexo: Masculino
Localização: Recife

Item do menu não ativa

04-04-2013 21:31

Boa noite a todos!

Estou criando um menu horizontal e me perdi em um erro que está me tirando noites de sono. Ao clicar em algum item do menu, o mesmo não fica ativado, o resto esta funcionando perfeitamente.

Segue os scripts:

index.html

<body> <ul class="blue"> <li><a href="#noticia1" title="Mercúrio" class="current"><span>Mercúrio</span></a></li> <li><a href="#noticia2" title="Vênus"><span>Vênus</span></a></li> <li><a href="#noticia3" title="Terra"><span>Terra</span></a></li> <li><a href="#noticia4" title="Marte"><span>Marte</span></a></li> </ul>

CSS

body { padding: 50px; margin: 0; } ul { padding: 5px; /* margin: 10px 0; */ margin-left: 25%; list-style: none; background-color: #fff; border-bottom: 1px solid #e7e7e7; float: left; clear: left; } ul li { float: left; display: inline; /*For ignore double margin in IE6*/ margin: 0 10px; } ul li a { text-decoration: none; float:left; color: #999; cursor: pointer; font: 900 14px/22px "Arial", Helvetica, sans-serif; } ul li a span { margin: 0 10px 0 -10px; padding: 1px 8px 5px 18px; position: relative; /*To fix IE6 problem (not displaying)*/ float:left; } /*BLUE*/ ul.blue li a.current, ul.blue li a:hover { background: url(images/blue.png) no-repeat top right; color: #0d5f83; } ul.blue li a.current span, ul.blue li a:hover span { background: url(images/blue.png) no-repeat top left; }

Arquivo JScript

$(function(){ $('#conteudo').hide(); var noticia; var hash = window.location.hash; if (hash !='') { noticia = $(hash).html(); $('.blue li a[href="' + hash + '"]').parent().addClass('ativo'); } else { noticia = $('#conteudo div:first-child').html(); $('.blue li:first-child').addClass('ativo'); } $('#noticia').append('<div>' + noticia + '</div>').find('div').slideDown(); $('.blue li a').click(function(){ $('.ablue li').removeClass('ativo'); $(this).parent().addClass('ativo'); var ancora = $(this).attr('href'); var nome = ancora.substr(1, ancora.length); noticia = $('#conteudo div[id="' + nome + '"]').html(); $('#noticia').empty(); $('#noticia').append('<div>' + noticia + '</div>').find('div').slideDown(); return false(); }) })

Os links estão funcionando perfeitamente. O erro é quando clico por exemplo em Terra (item do menu) o mesmo não fica ativado, a página aparece normal, mas continua com o item Mercurio ativado.

Alguém poderia me ajudar?
Agradeço desde já
kklo

MOVIDO PARA JAVASCRIPT
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17639
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Item do menu não ativa

05-04-2013 11:54

Depois dessa linha

$('.blue li a').click(function(){

O correto é

// removendo a class de todos os itens $('.blue li a').removeClass('current'); // adicionando a class no item clicado $(this).addClass('current');

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 10 postagens
Mais de 10 postagens
Tópico Autor
Mensagens: 22
Nome: Ricardo
Sexo: Masculino
Localização: Recife

Item do menu não ativa

05-04-2013 15:10

Muito obrigado mesmo. Está resolvido.
0

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado