(Resolvido) Mostrando e ocultando div.

[majorchip]

Boa noite para todos!

Galera estou precisando de ajuda!

quero colocar um efeito no meu site só que não conheço muito de javascript.

Bem, na verdade sou iniciante.

estou tentando fazer um código que faz o seguinte:

são 5 divs, sendo uma visivel e as outra quatros oculta.

quando eu clico em um determinado link a função deve ocultar a div

que estar visivel e mostrar a div oculta a qual o link se refere.

Se alguém poder me dar uma luz ou se souberem de algum códico

que faça isso agradeço.

Obrigado

Luciano.

[Jonathan Queiroz]

Para ocultar div's você tem que fazer algo como isso:

document.getElementById("id-de-minha-div").style.visibility = "hidden"

Para torná-las visíveis altere o visibility para "visible"

Tente fazer o resto do código sozinho e, se não conseguir, poste aqui !

[majorchip]

Bom amigo!

Obrigado pela ajuda.

Sim, já fiz esse código e funciona.

function mostrar (){

     var box = document.getElementById();
     if ( box.style.visibility == "hidden" )
     {
        box.style.visibility = "visible";
     }
      else     {
        box.style.visibility = "hidden";
       }
}

A dúvida é; como fazer para saber qual a div ativa no momento?

de posse dessa informação ocultar a div ativa e mostrar a outra div que

estar oculta.

Agradeço desde já

Obrigado.

}

[Jonathan Queiroz]

Você já fez o código para verificar se a div está ativa !

Mesmo assim, faça o seguinte:

Crie 5 div's (cada uma com o nome divisao1, divisao2, [...]

E utilize este código:

for (i=1;i<=5;i++) {
if (document.getElementById("divisao" + i).style.visibility=="hidden") {
document.getElementById("divisao" + i).style.visibility = "visible"
}else{
document.getElementById("divisao" + i).style.visibility = "hidden"
}
}

Espero ter ajudado !

[majorchip]

Você já fez o código para verificar se a div está ativa !

Mesmo assim, faça o seguinte:

Crie 5 div's (cada uma com o nome divisao1, divisao2, [...]

E utilize este código:

for (i=1;i<=5;i++) {
if (document.getElementById("divisao" + i).style.visibility=="hidden") {
document.getElementById("divisao" + i).style.visibility = "visible"
}else{
document.getElementById("divisao" + i).style.visibility = "hidden"
}
}

Espero ter ajudado !

Boa noite amigo! obrigado pela ajuda. Fiz uma função simples e não ficou tão bonita, mas funciona. Consegui atingir meu objetivo com ela. gostaria da sua opinião! se houver uma forma diferente ou mais eficiente, que faça a mesma coisa, claro considerando o tamanho da função por favor post. como eu disse antes sou iniciante e leio muito para chegar nesse ponto. Toda ajuda é bem vinda. Segue abaixo a função:

function camada(ltt){

            if (document.getElementById("home").style.visibility = "visible"){
    document.getElementById("home").style.visibility = "hidden";}
                    
            if (document.getElementById("forn").style.visibility = "visible"){
    document.getElementById("forn").style.visibility = "hidden";}
    
            if (document.getElementById("cad").style.visibility = "visible"){
    document.getElementById("cad").style.visibility = "hidden";}
                    
            if (document.getElementById("logist").style.visibility = "visible"){
    document.getElementById("logist").style.visibility = "hidden";}
                    
            if (document.getElementById("rep").style.visibility = "visible"){
    document.getElementById("rep").style.visibility = "hidden";}
                
            if (document.getElementById(ltt).style.visibility == "hidden"){
    document.getElementById(ltt).style.visibility = "visible";}
}

Aguardo seu retorno.

obrigado.

[Jonathan Queiroz]

Sim, você pode fazer isso !

Deixaria seu código mais limpo !

Seu código ficaria assim:

function camada(ltt) {
camadas = new Array(4)
camadas[0] = "home"
camadas[1] = "forn"
camadas[2] = "cad"
camadas[3] = "logist"
camadas[4] = "rep"

for (i=0;i<=camadas.length;i++) {
camada_atual = document.getElementById(camadas[i])
if (camada_atual.style.visibility = "visible" {
camada_atual.style.visibility = "hidden"
}
}
camada_ltt = document.getElementById(ltt)
if (camada_ltt.style.visibility = "hidden") {
camada_ltt.style.visibility = "visible"
}
}

Obs.:

Estarei marcando seu tópico como Resolvido

Qualquer cosia, posta aí !

[InfoCidreira]

Sim, você pode fazer isso !

Deixaria seu código mais limpo !

Seu código ficaria assim:

function camada(ltt) {
camadas = new Array(4)
camadas[0] = "home"
camadas[1] = "forn"
camadas[2] = "cad"
camadas[3] = "logist"
camadas[4] = "rep"

for (i=0;i<=camadas.length;i++) {
camada_atual = document.getElementById(camadas[i])
if (camada_atual.style.visibility = "visible" {
camada_atual.style.visibility = "hidden"
}
}
camada_ltt = document.getElementById(ltt)
if (camada_ltt.style.visibility = "hidden") {
camada_ltt.style.visibility = "visible"
}
}

Obs.:

Estarei marcando seu tópico como Resolvido

Qualquer cosia, posta aí !

Com JQuery você usa menos codigo para fazer isso.

Segue o link para estudo http://jquerybrasil.com/help.html

Qualquer duvida posta ai.

Até mais