When clicking button, increase or decrease height of a div

Question

I created a button inside a div (#divteste) and would like to click on that div button(#divteste) increase the height and click again on the button to decrease the height and if there is a way to carry out a transfer or Animate.

Answer 1

Try with the Animate like this

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

Where 200 would be the time in milliseconds for animation; You can also create by adding 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');
        }
    });