Menu DHTML - Abre/fecha com clique do mouse

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

[ Hits: 21.427 ]

Download menu_abre_fecha.html




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

Músicas kboing

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

Atualização de combos inferiores baseado nos combos superiores

Proteção com senha

Palheta de cores utilizando Json e javascript não obstrutivo


  

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";
}


[2] Comentário enviado por tiago pimentel em 19/04/2010 - 09:08h

Vlw pelo incrementação, e é assim, um ajudando ao outro para o bem de todos.


Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts