Menu em Java fica aberto na pagina.

cjm · Outubro 19, 2010

Bom pessoal, o meu problema é o seguinte:

Estou criando uma página onde tem 3 textos muito grandes, então resolvi dividir em três tópicos e colocar um código java para quando a pessoa clicar em um tópico aparecer o texto, como no esquema abaixo:

------------------------------------------------------------------------

TÓPICO 1 TÓPICO 1

TÓPICO 2 => Caso o usuario clique no tópico 2 fica assim: TÓPICO 2

textotextotexto

TÓPICO 3 TÓPICO 3

-------------------------------------------------------------------------

Bom, o script que eu coloquei está funcionando perfeitamente do modo que eu quero, porém, quando eu abro a pagina, logo de inicio esse menu fica com todos os tópicos em aberto e a página fica gigante.

Já testei de tudo, vou postar o script que eu uso aqui:

<li><a style="cursor:hand; text-decoration:underline;" onclick="
document.getElementById('Parte1').style.display='block';
document.getElementById('Parte2').style.display='none'; 
document.getElementById('Parte3').style.display='none';
document.getElementById('Parte4').style.display='none';
document.getElementById('Parte5').style.display='none';
document.getElementById('Parte6').style.display='none';
document.getElementById('Parte7').style.display='none';
document.getElementById('Parte8').style.display='none';
document.getElementById('Parte9').style.display='none';
document.getElementById('Parte10').style.display='none';
document.getElementById('Parte11').style.display='none';
document.getElementById('Parte12').style.display='none';
document.getElementById('Parte13').style.display='none';">Titulo do Texto</a></li>
</ul>

<!--BLOCO I-->
<br />
<div id="Parte1">
<ul>
   <div class="titulo2">Titulo do Texto</div>
<br />
    <h2>TEXTOTEXTOTEXTOTEXTOTEXTO. </h2>
<br />

     <img src="images/linha.jpg" /></h2>
     <br />
</ul>
<div style="text-align: right;">[ <a style="cursor: hand;" onclick="document.getElementById('Parte1').style.display='none';">FECHAR CONTEÚDO</a> ]</div>

Depois desse texto existem mais dois textos, sendo que já deixei o code pronto para usar 13 textos. Vou postar abaixo também o .JS:

//ESCONDER E ABRIR INFORMACOES DOS CURSOS
function showParte1() {
document.getElementById("Parte1").style.visibility = "hide";
}

function showBlocoI() {
document.getElementById("BlocoI").style.visibility = "hide";
}

Obrigado pela ajuda,

Claudio

Stoma · Outubro 21, 2010

Olá!

O que você pode fazer no caso dos textos, é que ao invés de usar o onclick e depois colocar display='none' em cada uma das div's, é colocar uma classe em cada div (ex: 'divBloco') e chamar uma função que faça um for e utilize o document.getElementsByClassName e esconda/mostre cada div sem precisar especificar nome nenhum. Para abrir a página e não mostrar o menu, chame a mesma função escondendo-os.

Ex:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
    <head>
        <title>Teste</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    </head>
    <body>
        <button onclick="ocultar('block');">Mostrar</button>
        <button onclick="ocultar('none');">Esconder</button>
        <button class='teste'>A</button>
        <button class='teste'>B</button>
        <button class='teste'>C</button>
        <br></br>

        <script type="text/javascript">
            ocultar("none");
            function ocultar(value){
                blocos = document.getElementsByClassName("teste");
                count = blocos.length;
                for(x=0; x<count; x++){
                    blocos[x].style.display = value;
                }
            }
        </script>    
    </body>
</html>

Entrar

Menu em Java fica aberto na pagina.

Pergunta

cjm

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

Stoma

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades