JQuery/CSS - 包装-DIV 的平滑更改高度答案

【问题标题】：JQuery/CSS - smooth change height of wrapping-DIVJQuery/CSS - 包装-DIV 的平滑更改高度
【发布时间】：2016-10-05 11:58:35
【问题描述】：

我有一堆 DIV 嵌套在一个 wrapper-DIV 中

<div id="wrapper">
    <div id="inner_1"></div>
    <div id="inner_2"></div>
    <div id="inner_3"></div>
</div>

每个内部 DIV 都有不同的高度。我确实通过fadeIn/fadeOut() 显示/隐藏内部DIV，因此包装器的高度从小（inner_1）跳到高（inner_2）以包装内部DIV，如图所示。

有没有一种简单的方法来设置 wrapper-DIV 的高度，使其平滑滑动以适应内部 DIV 高度？

这里是一个示例的链接： https://jsfiddle.net/a3wvxcuq/#

【问题讨论】：

【解决方案1】：

只需将一个以毫秒为单位的数字传递给.show() 和.hide() 方法，div 就会平滑过渡到新的维度。

所以这只是为您指明了正确的方向。

现在代码就是你的画布，你就是艺术家 ;)

所以另一种看起来华而不实的方式：Demo 2

安德，看来我们这里有赢家。 Demo 3

【讨论】：