Mostra oculta DIV [Resolvido]


(João Ernani) #1

Ola, preciso fazer de ocultar e mostrar div com jQuery, algo igual no site do BB que tem la no topo.
http://www.bb.com.br/pbb/pagina-inicial#/

Alguém tem algo parecido?

Obrigado


(Valdeir Santana) #2

Você pode utilizar essa função http://api.jquery.com/toggleclass/

$('button').click(function() {
  $('#div').toggleClass('active')
});


#div {display:none}
#div.active {display:block}

(Douglas Oliveira Garrido) #3

Dá pra fazer como o @valdeir2000 falou, mas caso queira usar uma "animação", dá pra fazer assim também:

$('button').click(function() {
  if ($('#div').css("display") == "none") {
    $('#div').show(300); // 300 milisegundos
  } else {
    $('#div').hide(300); // 300 milisegundos
  }
});

PS: Recomendo também armazenar a DIV em uma variável, assim:

var div = $("#div");

Pois no exemplo que eu dei, usei o "$(#div)" 3 vezes, então, armazenando-o em uma variável é mais recomendado. Depois você usa "div." (DIV + ponto + método/função do jQuery).


(Diego Eis) #4

Eu ainda prefiro usar a animação direto no CSS, usando transition. Mais performático e muito melhor para dar manutenção.

@joaoernani conseguiu resolver?


(João Ernani) #5

@diegoeis, já sim...obrigado a todos! Abraço