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

Jumping slides in slick slider with variable width and center mode

我正在使用灵活的滑块在我的网站上显示一个居中的滑块。 滑块应在中央显示一个项目,并在左右显示较小的项目。

为此,我使用了 centerModevariableWidth。 现在的问题是,每次更改后幻灯片都是 "jumping"。

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

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

唯一的问题是您有两个不同的图像高度,无论其父幻灯片是否有中心 class。

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

使它们相同,您的问题就消失了;)

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

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