Arquivo Discussoes de Programacao e Tecnologia Supondo que tenho:
[color=red]Aba 1[/color] | Aba 2 | Aba 3
Supondo que o default selecionado é a “Aba 1”, como faço para ao clicar na opção Aba 2 e carregar o respectivo conteúdo por ajax, deixar assim:
Aba 1 | [color=red]Aba 2[/color] | Aba 3, mudar o estilo conforme a aba selecionada ??
Espero ter sido esclarecedor !!!
Valew.
Vou te passar a lógica, não tenho como testar agora.
Vc vai precisar de uma função em javascript que no onMouseOver do botão “aba2” pegue o ID dela e fale pra ela usar outro style CSS.
Exemplo:
function onMouseOverAba(pAba) {
var aba = document.getElementById(pAba);
aba.style.color="#DDDDDD";
aba.style.background-color="#AAAAAA";
}
essa função deve ser chamada no onMouseOver de quem vc quer trocar o mouse, e passe o ID da aba como parâmetro da função.
completando o pafuncio:
seu menu
<span onclick="newAba('1')">Menu1</span>
<span onclick="newAba('2')">Menu2</span>
<span onclick="newAba('3')">Menu3</span>
sua página:
<div id="1">
Oi 1
</div>
<div id="2">
Oi 2
</div>
<div id="3">
Oi 3
</div>
seu javascript:
function newAba(x){
document.getElementById('1').style.visibility = hidden;
document.getElementById('2').visibility= hidden;
document.getElementById('3').visibility = hidden;
document.getElementById(x).visibility = visible;
}
Eh mais ou menos isso aí.
Cara se vc estiver usando jsf no Tomahawk ja tem isso pronto
Vou te passar a lógica, não tenho como testar agora.Vc vai precisar de uma função em javascript que no onMouseOver do botão “aba2” pegue o ID dela e fale pra ela usar outro style CSS.
Exemplo:
function onMouseOverAba(pAba) { var aba = document.getElementById(pAba); aba.style.color="#DDDDDD"; aba.style.background-color="#AAAAAA"; }essa função deve ser chamada no onMouseOver de quem vc quer trocar o mouse, e passe o ID da aba como parâmetro da função.
Cara fiz dessa maneira e não funcionou, veja como fiz:
<div id="menu">
ul>
<li ><a >Principal</a></li>
<li><a >Empresa</a></li>
</ul>
</div>
Existe alguma outra maneira ?
Valew.