Menu DHTML - Abre/fecha com clique do mouse [Javascript]

Menu DHTML - Abre/fecha com clique do mouse

Publicado por Tiago da Silva Pimentel (última atualização em 01/11/2009)

[ Hits: 21.759 ]

Download menu_abre_fecha.html

0 0

Denuncie Favoritos Indicar

Script bem simples. Menu que é exibido ao se clicar em um link e ocultado ao clicar novamente.

Esconder código-fonte

<html>
   <head>
      <script type="text/javascript">
         function startmenu()
         {
            af.style.display = "none";
          }
          
         function abrefecha()         
         {
            if(af.style.display == "none")
            {
               af.style.display = "block";
            }
            else
            {
               startmenu();
            } 
         }
      </script>
   </head>
   <body>
      <a href="javaScript:abrefecha()">Menu Abre/Fecha</a>
      <div id="af" style="display: none;">
         <a href="" style="padding-left:15px;">Sub-Menu(01)</a><br/>
         <a href="" style="padding-left:15px;">Sub-Menu(02)</a><br/>
         <a href="" style="padding-left:15px;">Sub-Menu(03)</a><br/>
         <a href="" style="padding-left:15px;">Sub-Menu(04)</a>
      </div>
   </body>
</html>

Scripts recomendados

Var_dump

Relógio Modo Texto.

Jogo Snake em HTML5

Jogo Snake feito em TypeScript e Phaser 2 (com gráficos)

JSOO - Classe Calculadora em JavaScript

Comentários

[1] Comentário enviado por havacci em 03/11/2009 - 07:33h

hmm .. massa..
mas pra melhorar um pouco o código.. (mais o entendimento...)
eu sugiro em vez de criar 2 funçoes, usar uma só, visto que a segunda startmenu() contem somente uma instrução, e chamadas de funções são dispendiosas..
portanto terá uma funcao apenas com o conteudo

function abrefecha()
{
if(af.style.display == "none")
{
af.style.display = "block";
}
else
{
af.style.display = "none";
}

1 0