我需要在三个不同状态之间的字段上进行转换。此字段在初始状态下始终具有相同的高度大小，单击此字段应将其高度增加到自动大小（根据新内容的高度）。此时所有内容都可以工作，但问题出现是因为在mouseleave元素应根据新内容将其高度更改为新高度。一切都发生在同一个领域（div），是改变大小的内容。
所以......我有一个领域......三种不同的状态，我需要在这些状态之间转换：
我已经读过您可以使用最大高度过渡替换高度自动，但是......这样做不起作用，因为第三次过渡（在mouseleave上）应该回到新的高度尺寸。
我该怎么办？我应该只考虑用CSS来解决这个问题吗？也许我需要一些jquery或js？