Código link marcado quando ativo e naoativoo JavaScript

08/10/2012

0

Olá!

Estou montando um site,gostaria que todas ações do meu menu ficassem selecionada quando eu clicar na opção dele, meu site possui um menu normal na vertical, mas tem certas opções que quando clicadas tem um menu dentro delas para especificar certos conteúdos.
Possuo um código JavaScript que quando você clica em alguma opção dele deixa marcado identificando aonde você esta, mas só que quando eu clico nas opções que possui um menu nas páginas se desmarca automaticamente, eu gostaria que ficassem como o exemplo desse site http://suddenattack.nexon.net/Guide/Maps

Esse aí abaixo é o código que eu tenho JavaScript dos links Ativo e Inativo:

// JavaScript Document
//função que troca a classe dos li para ativo e inativo
function ativoinativo(quem){
//o quem original é um link, agora tô pegando o li pai
var lipai = quem.parentNode;
if(lipai.className==ativo){
//se ele já era ativo vira inativo
lipai.className = inativo;
}else{
//se ele não tinha classe ainda, transformo em ativo
lipai.className = ativo;
//e também faço seus irmãos li virarem inativos
var irmaosli = lipai.parentNode.childNodes; //pegando os irmaos li
for(var i=0; iirmaosli.length ; i++){ //varrendo os li
var liatual = irmaosli[i];
if(liatual != lipai && liatual.nodeName==LI){
//se não é o li atual vai virar inativo
irmaosli[i].className = inativo
}
}
}
}

//função que testa qual li que tem o link atual e marca como ativo
function initAtivoInativo(divalvo){
if(!divalvo.nodeName){
//testando se o divalvo já é um objeto
//se não for, eu uso o velho getElementById
divalvo = document.getElementById(divalvo);
if(!divalvo){ alert(Erro: o divalvo não existe); return;}
}
//pegando os li que tão dentro do divalvo
var ah,lis = divalvo.getElementsByTagName(li);
for(var i=0; ilis.length ; i++){

//pegando os links que tão dentro de cada li
ah = lis[i].getElementsByTagName(a)[0];
if(!ah){ continue; } //se não achou o link vai pro prox li

//ativando o onclick nos links pra fazer a troca de ativo/inativo
ah.onclick = function(e){
//pegando o alvo crossbrowser http://elcio.com.br/crossbrowser/#7
if(typeof(e)==undefined)var e=window.event;
source=e.target?e.target:e.srcElement; //
if(source.nodeType == 3)source = source.parentNode
//ativando o onclick nos links pra fazer a troca de ativo/inativo
ativoinativo(source);
}

if(location.href.indexOf(ah.href)-1){
//se o endereço atual tem o link do li atual marco ativo
lis[i].className = ativo
}else{
//senão é inativo
lis[i].className = inativo
}
}
}
//ativando no onload (mas depois de um tempinho pra não bugar em alguns browsers heheh)
//você pode usar body onload tb ou onready de libs
window.onload = setTimeout(function(){initAtivoInativo(…

Se alguém souber de um outro código, agradeço pela ajuda, valeu!!
éverton Ramos

éverton Ramos

Responder

Posts

08/10/2012

Bruno Betioli

Seu site será em PHP? E serão várias páginas ou uma página que busca vários conteúdos no banco? Se for como o último que citei, posso lhe ajudar a fazer isso com PHP. É até melhor, pois, se o Javascript ~do navegador do usuário estiver desabilitado, isto que está tentando fazer será inútil.
Responder

Assista grátis a nossa aula inaugural

Assitir aula

Saiba por que programar é uma questão de
sobrevivência e como aprender sem riscos

Assistir agora

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar