<分区>
我有一个带有不同高度幻灯片的 slider 。作为副作用， slider div 之后的内容将随着每次幻灯片变化而上下“跳跃”。 这是我的问题:当 slider 改变高度时，如何实现 slider 平滑移动到位后的内容？我试过 CSS 过渡属性，但无济于事。
为了说明我的目标，这里有一个 Apple 页面的链接，他们做得恰到好处:http://www.apple.com/tvos/
<分区>
我有一个带有不同高度幻灯片的 slider 。作为副作用， slider div 之后的内容将随着每次幻灯片变化而上下“跳跃”。 这是我的问题:当 slider 改变高度时，如何实现 slider 平滑移动到位后的内容？我试过 CSS 过渡属性，但无济于事。
为了说明我的目标，这里有一个 Apple 页面的链接，他们做得恰到好处:http://www.apple.com/tvos/
最佳答案
基本上，你有这样的布局:
<slider></slider>
<rest-of-content></rest-of-content>
虽然，实际上，<rest-of-content> 的位置<slider>时页面发生变化高度已更改，您可以在 <rest-of-content> 更改nothing使其顺利跳跃。你需要制作 height <slider>的属性(property)DOM 中的其他所有内容都会平滑地自动更改也会顺利换位。
动画 height slider 的属性根据您使用的 slider 而有很大差异，但其中有很多提供了开箱即用的动画高度变化的能力，并且可以通过初始化设置来完成。我不以任何方式认可它，但我肯定知道 slick carousel 有这个选项。向下滚动到“自适应高度”部分。
当然，您可能希望保留现在使用的 slider ，并使用其启动幻灯片更改的回调、获取新幻灯片的高度并设置 slider 容器高度的动画以匹配新 slider 。为了让您的内容不跳转，您可能需要为整个 slider 使用 overflow:hidden 的容器。并更改该容器的 max-height每次幻灯片更改时。
希望以上内容对您有所帮助。
关于jquery - 具有不同高度的 slider 后内容更改位置的过渡，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42180579/