Expand div on click with smooth animation

Question

I am trying to expand a div with speed/smooth animation. Right now div expands with sudden change, my requirement is to give smooth animation while expanding.

Fiddl

Answer 1

I have some solution for you, But in that case you can not set hieght to auto, you can do following, replace you jquery code with these :-

$('.click1').find('a[href="#"]').on('click', function (e) {
    e.preventDefault();
    this.expand = !this.expand;
    $(this).text(this.expand?"Hide Content":"Read More");

    $(this).closest('.click1').find('.smalldesc, .bigdesc').animate({
        "height": "400px"
    }, "slow");  
});

It may help you.