Как добавить анимацию плавного дораскрытия блока?

Question

[viktorulyushev]

Есть блок с такой структурой

<div class="tabs-content tabs-content-one">
   <div class="tabs-content-one-content tab-content details-tabs-deacription" >
          Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа
          <div class="open-hidden-text">
              <a class="open-tab" href="#"></a>
          </div>
   </div>
</div>

По умолчанию высота блока tabs-content-one-content 500px,и по нажатию на open-hidden-text блок дораскрывается до конца,и при повторном нажатии закрывается до тех же 500px.Как сделать то же самое но плавно? SlideToggle срабатывает не правильно,закрывая весь блок

$(document).ready(function () {
    $(".tabs .tabs-content .tabs-content-one-content").each(function (index) {
        if ($(this).height() > 500) {
            $(this).addClass("tabs-content-one-content-height");
        }
        $(this).children(".open-hidden-text").click(function () {
           $(this).parent().toggleClass('open-hidden-text-open');
            return false; 
        });
    });
});

Answer 1

[Владимир Сартаков]

jsfiddle.net/zbhfrkp3/2

Answer 2

[Localhost]

('open-hidden-text-open', 3000)
или почитай про стандартные анимации
.show() .hide()