内容变化的平滑过渡

Question

我有一个未知高度的 DIV，其内容可以从 javascript 事件中更改。当内容更改时，DIV 会调整大小以适应新内容。我想要做的是让 DIV 平滑地而不是突然地过渡到不同的高度。

我尝试将其添加到 DIV 的 CSS 中，但没有帮助。除非我设置了元素的特定高度。

transition: height 1s linear;

有没有一种简单的方法可以根据内容做到这一点？或者我别无选择，只能编写一个javascript函数并手动控制它。？

Answer 1

在这种情况下，创建一个单独的转换类并将该类与 Javascript 事件一起添加到该 DIV。

document.getElementById('divID').className='CssTransitionClassName';