0

Galera tenho o seguinte HTML

<nav class="nav nav-default">
  <div class="container">
    <a href="#" class="nav-brand">Brand</a>

    <button type="button" class="nav-button">
      <span class="fa fa-navicon"></span>
    </button>

    <ul class="nav-links" id="nav-links">
      <li><a href="#">Links1</a></li>
      <li><a href="#">Links2</a></li>
      <li><a href="#">Links3</a></li>
      <li><a href="#">Links4</a></li>
      <li><a href="#">Links5</a></li>
    </ul>
  </div>
</nav>

E o seguinte javascript:

$(".nav-button").click(function() {
    $("#nav-links").css("display","block");
});

O que acontece: Clico ele mostra os links mas quando clico novamente quero que esconda de novo, já testei:

Mostrar e esconder uma div clicando no mesmo link

Como esconder/mostrar uma div em HTML?

Só que não consigo o resultado esperado. Aguardo respostas..

1 Resposta 1

1

Você pode utilizar a função toggle()do jQuery:

$(".nav-button").click(function() {
    $("#nav-links").toggle('slow');
});
3
  • Obrigado, deu certo, sem querer ser preguiçoso, mas como que muda esse slow pra um que seja mais rápido? nem muito rápido mas nem muito de vagar ? Commented 20/08/2016 às 21:15
  • 1
    Você pode passar ele sem o 'slow' ou poderá passar ele com o 'fast' como nesse exemplo: $("#nav-links").toggle('fast');. Commented 20/08/2016 às 21:18
  • 1
    vlw deu certo. obrigado Commented 20/08/2016 às 21:19

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .