jquery - 当高度为动态时滑动切换元素

Question

按下箭头时，我会显示评论部分，如下图所示。这也是一个小提琴。

两部分应该在这里滑动切换，信息文本部分和评论部分。

问题是顶部正方形在显示时不会滑动切换（从高度 60px 到高度 100%）。然而，它在隐藏时会滑动（从 100% 到 60px）。

我希望它在显示时滑动，但无法弄清楚。我的猜测是它不会滑动，因为高度是动态的（100%）并且 jQuery 需要一个特定的像素目标高度来制作动画？

$("footer").on("tap click", function () {
    $(this).parent().next().slideToggle();
    var section = $(this).prev();
    section.height() == 60 ? 
       section.height("100%") : 
       section.animate({ height: "60"}, "fast");
});

Answer 1

$("footer").on("tap click", function () {
    $(this).parent().next().slideToggle();
    var section = $(this).prev(),
        toHeight = (section.height() == 60) ? section.get(0).scrollHeight : 60;
    section.animate({ height: toHeight}, "fast");
});