如何在加载时修复光滑的滑块跳跃图像

Question

我有一个具有adaptiveHeight属性设置为false的滑动滑块。因此，如果我在光滑容器中首先滑动小图像 - 它将垂直居中，左侧区域将填充背景颜色（如this image中所示）。

如何在加载光滑之前计算光滑的滑块区域高度，以防止在加载时“跳跃”？有谁知道，光滑的容器中如何计算图像的高度和宽度？有任何想法吗？

Answer 1

您可以使用ImagesLoaded这样的插件包装光滑，以确保您的图像在初始化Slick之前具有高度。如果你不想要创建无格式图像的闪光，你需要先应用一些样式来隐藏它们（例如，将它们完全放在屏幕的左侧），然后在加载图像时删除这些样式，像：

$('#slider').imagesLoaded( function() {
  // remove your hiding class
  // initialise slick
});