Ir para conteúdo
Fórum Script Brasil
  • 0

(Resolvido) menu popup

unisov

Perguntado por unisov,

 Share

Pergunta

unisov

unisov

Postado
Postado

ola

peguei um codigo de popup e estou tentando fazer um codigo de meu com ele...

ate agora esta funcionando, pois ao abrir uma div as outras são fechadas...

eu so queria saber como eu faço para, ao abrir a pagina apenas uma div esteja aberta, e não todas...

alguém pode ajudar?

não entendo nada de javascript, assim fica dificil ate procurar...

eu procurei muito na net, mas talvez não esteja sabendo procurar pela coisa certa...

<script language="javascript" type="">
function abrir_1(){
document.getElementById('1').style.display = 'block';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'none';
}
var document.getElementById('1').style.display

function abrir_2(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'block';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'none';
}
function abrir_3(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'block';
document.getElementById('4').style.display = 'none';
}
function abrir_4(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'block';
}

</script>

<a href="java script: abrir_1();">[abrir]</a>
<a href="java script: abrir_2();">[abrir]</a>
<a href="java script: abrir_3();">[abrir]</a>
<a href="java script: abrir_4();">[abrir]</a>





<DIV id="1">

<p>Testando 1</DIV>


<DIV id="2">

<p>Testando 2</DIV>

<DIV id="3">

<p>Testando 3</DIV>

<DIV id="4">

<p>Testando 4</DIV>

Link para o comentário
Compartilhar em outros sites

6 respostass a esta questão

Posts Recomendados

  • 0
Matheus Matos

Matheus Matos

Postado
Postado

Olá unisov. Bem, basta dizer, que a div 1, por padrão, esteja visível. Para isso, basta colocar no início do script, o getElementById, assim:

document.getElementById('1').style.display='block';
bem, na tag script, ao invés de utilizar language, utilize o type! Bem, o código completo seria: 
<script type="text/javascript">
document.getElementById('1').style.display='block';
function abrir_1(){
document.getElementById('1').style.display = '

Olá unisov. Bem, basta dizer, que a div 1, por padrão, esteja visível. Para isso, basta colocar no início do script, o getElementById, assim:
[code]document.getElementById('1').style.display='block';
bem, na tag script, ao invés de utilizar language, utilize o type! Bem, o código completo seria: 
<script type="text/javascript">
document.getElementById('1').style.display='block';
function abrir_1(){
document.getElementById('1').style.display = 'block';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'none';
}
var document.getElementById('1').style.display

function abrir_2(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'block';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'none';
}
function abrir_3(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'block';
document.getElementById('4').style.display = 'none';
}
function abrir_4(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'block';
}

</script>

<a href="java script: abrir_1();">[abrir]</a>
<a href="java script: abrir_2();">[abrir]</a>
<a href="java script: abrir_3();">[abrir]</a>
<a href="java script: abrir_4();">[abrir]</a>





<DIV id="1">

<p>Testando 1</DIV>


<DIV id="2">

<p>Testando 2</DIV>

<DIV id="3">

<p>Testando 3</DIV>

<DIV id="4">

<p>Testando 4</DIV>

bem, eu não sou fera em javascript, mas, creio que está certo, enfim, testa aí... :lol:

Vlw

Matheus Matos

Link para o comentário
Compartilhar em outros sites
  • 0
unisov

unisov

Postado
  • Autor
Postado

opa

vlw pela resposta Matheus

mas infelizmente não deu certo... talvez ate por algum erro meu...

mas eu consegui resolver de outra forma

colocando "style=display:none;" nas divs q eu não quero q apareçam no inicio...

vlw

<script language="javascript" type="">
function abrir_1(){
document.getElementById('1').style.display = 'block';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'none';
}

function abrir_2(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'block';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'none';
}
function abrir_3(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'block';
document.getElementById('4').style.display = 'none';
}
function abrir_4(){
document.getElementById('1').style.display = 'none';
document.getElementById('2').style.display = 'none';
document.getElementById('3').style.display = 'none';
document.getElementById('4').style.display = 'block';
}

</script>



<a href="java script: abrir_1();">[abrir]</a>
<a href="java script: abrir_2();">[abrir]</a>
<a href="java script: abrir_3();">[abrir]</a>
<a href="java script: abrir_4();">[abrir]</a>





<DIV id="1"><p>Testando 1</DIV>
<DIV id="2" style=display:none;><p>Testando 2</DIV>
<DIV id="3" style=display:none;><p>Testando 3</DIV>
<DIV id="4" style=display:none;><p>Testando 4</DIV>

Link para o comentário
Compartilhar em outros sites
  • 0
Jonathan Queiroz

Jonathan Queiroz

Postado
Postado

Primeiramente, tente aprimorar um pouco esse código, ficou bastante repetitivo.

O JS poderia ficar assim:

function ElementosPorClasse(c) {
    var e = document.getElementsByTagName("*")
    var a = []
    var i, y
    for (i = 0, y = 0; i < e.length; i++) {
        if (e[i].className == c) {
            a[y] = e[i]
            y++
        }
    }
    return a
}
function MostraEsconde(){
//Esconde todas as divs da classe "teste"
var divs=ElementosPorClasse("teste")
for(var i=0;i<divs.length;i++){
divs[i].style.display="none"
}
//Mostra a div atual
this.style.display="block"
}
//Evento onload
onload=function(){
//Chama a função "MostraEsconde" no clique de alguma das divs
var divs=ElementosPorClasse("teste")
for(var i=0;i<divs.length;i++){
divs[i].onclick=MostraEsconde
}
}
E o HTML +/- assim: 
<div class="teste">aaa</div>
<div class="teste">bbb</div>

Teste aí e poste aqui o resultado.

Link para o comentário
Compartilhar em outros sites
  • 0
unisov

unisov

Postado
  • Autor
Postado

ola Jonathan

obrigado pela ajuda...

esse codigo já vai me servir pra outra coisa ^^

no caso do meu primeiro post ele não serviria, pois eu pretendia ter um menu, com links q fariam as divis aparecerem e desaparecerem ao clicar no link, e não na div...

mas mesmo assim, muito obrigado...isso vai me ser muito util em outra coisa.

vlw mesmo

Link para o comentário
Compartilhar em outros sites
  • 0
Matheus Matos

Matheus Matos

Postado
Postado

opa unisov! aff... que cabeça a minha.. é como falei né... não sou fera em javascript, e minha intenção era deixa-la oculta com javascript, e nem prensei no tão simples CSS! hehe

mas é isso aí...

você ou o Jonathan marca o tópico como resolvido?

Vlw

Matheus Matos

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,6k
×
×
  • Criar Novo...