在具有可变宽度和中心模式的光滑滑块中跳跃幻灯片

Question

我正在使用光滑的滑块在我的网站上显示居中的滑块。 滑块应在中间显示一个项目，并左右显示较小的项目。

要执行此操作，我正在使用centerMode和variableWidth。 现在的问题是，幻灯片在每次更改后都会“跳跃”。

在文档中看起来不错。我的错是什么？

这是我的代码：http://jsfiddle.net/vv4j3uz2/1/

Answer 1

唯一的问题是，无论父级幻灯片是否具有中心级别，您都有两种不同的图像高度。

.slider-header .slick-slide img {height: 520px; [...]}
.slider-header .slick-slide.slick-center img {height: 600px; [...]}

让它们相同，你的问题就消失了;）

Answer 2

如果你给 .slick-track 一些 CSS 动画过渡效果，效果会很好。

.slick-track { transition: all 0.3s ease; }