Скрыть div на определенной высоте при использовании slidetoggle()

Question

У меня есть три div и я пытаюсь показать/скрыть div2, когда мы нажимаем на любой div. Пока мне это удалось, но теперь я хочу реализовать некоторую анимацию, пока show.hide div.

Я пробовал много и много читал, но из-за того, что я новичок в jQuery, я не могу это сделать. Вот мой код, который я попробовал, прежде чем анимация

http://jsfiddle.net/9Lw6T/119/

$(".more , .expander,.headingopen").click(function() { 
var expanderDiv = $(this).parents(".content_item").find(".textContent"); 

if ($(expanderDiv).length > 0 && $(expanderDiv).hasClass("expander")) { 
    $(expanderDiv).removeClass("expander"); 
    var MoreDiv = $(this).parents(".content_item").find(".more"); 
    $(MoreDiv).html("Mindre"); 
} 
else { 
    console.log("addclass"); 
    $(expanderDiv).addClass("expander new"); 
    var MoreDiv = $(this).parents(".content_item").find(".more"); 
    $(MoreDiv).html("More"); 
} 
}); 

jQuery(document).ready(function() { 
    jQuery(".more , .expander,.headingopen").click(function() { 
      jQuery('.expander').slideToggle("slow"); 

    }); 
}); 

После анимации или slidetoggle

http://jsfiddle.net/9Lw6T/123/

Есть ли способ оживить дивы и остановиться на определенной высоте в то время как slideup, как перед анимацией я сделал это в первой попытке без анимации. Slidedown требует автоматического скрытия и работы с этим кодом.

Благодаря

Answer 1

Существует проблема при использовании JQuery анимации собирается авто, так что вы должны сделать небольшую работу вокруг (см: JavaScript jQuery Animate to Auto Height)

// get the current height 
var curHeight = $textArea.height(); 
// set set the css to auto height and get how tall it is 
var autoHeight = $textArea.css('height', 'auto').height(); 
// set the css back to the original height, then animate to the new height 
$textArea.height(curHeight).animate({height: autoHeight}, 1000); 

Вот это все вместе http://jsfiddle.net/9Lw6T/127/