3

Criei um botão dentro de uma div (#divteste) e gostaria que ao clicar no botão essa div(#divteste) aumentasse o height e ao clicar novamente no botão diminuisse o height e se tiver como ultilizar uma trasição ou animate.

Meu código atual

1

1 Resposta 1

7

Tente com o animate assim

$('#seuBotao').on('click', function(){
    if($('.sua-div').height() == 30){
         $('.sua-div').animate({"height" : "200px"}, 200);
    }else{
        $('.sua-div').animate({"height" : "30px"}, 200);
    }
});

Onde 200 seria o tempo em milissegundos para a animação; Pode também criar adicionando classes:

 $('#seuBotao').on('click', function(){
        if($('.sua-div').hasClass('pequena')){
             $('.sua-div').animate({"height" : "200px"}, 200);
             $('.sua-div').removeClass('pequena');
             $(this).attr('value', 'Diminuir');
        }else{
            $('.sua-div').animate({"height" : "30px"}, 200);
            $('.sua-div').addClass('pequena');
            $(this).attr('value', 'Aumentar');
        }
    });
6
  • tentei aqui mais nao to conseguindo
    – matheus
    Commented 3/12/2016 às 0:23
  • Adicionou a biblioteca jquery ao seu site?
    – Leo Letto
    Commented 3/12/2016 às 0:24
  • pronto funcionou eu estava colocando o codigo no local errado
    – matheus
    Commented 3/12/2016 às 0:29
  • Ta animando do jeito que você quer?
    – Leo Letto
    Commented 3/12/2016 às 0:30
  • teria como mudar o valor de dentro do botao? tipo aumentar e quando aumentasse aparecesse diminuir
    – matheus
    Commented 3/12/2016 às 0:31

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 .