我正在切换 div 的内容(淡出旧内容，然后淡入新内容)，因为它们的内容略有不同，所以当它们改变时，它们下面的所有内容都会发生不和谐的重组。
我的问题是，有没有办法让这个 Action 流畅？
我怀疑几乎唯一可行的方法是使用 javascript 提前确定开始和结束元素的高度(在我的例子中，我只处理垂直对齐偏移的 block )，并直接分配这些值。一旦我这样做了，我确信 CSS3 过渡将应用一个愉快的动画。
有没有办法在不指定明确尺寸的情况下获得这个？我似乎记得在某个时候体验过元素以动画方式在页面上移动。这让我希望仅使用 CSS 即可完成。
最佳答案
我通常会创建一个包含新内容的临时(不可见)元素，以便计算其高度。之后，可以将原始元素从其当前高度动画化到新计算的高度。
重要的是创建的临时元素是原始元素的 相同兄弟 以便所有必要的样式级联并正确继承(例如，如果不计算新的内容高度就没有用'应用了正确的font-size)
虽然可以使用 CSS3 (transition: height .5s ease;) 在明确设置的不同高度之间设置动画(即如上所述使用 JS)，但它不适用于隐式设置的不同高度(即用 height:auto)
关于javascript - 动画页面回流？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11488434/