carousel - Flickity 轮播图像压缩在一起

Question

我在我的网站上使用这个滑块：http: //flickity.metafizzy.co

图像以压扁的形式加载，但在刷新时有时会显示为应有的样子。我减小了图像大小，因为我认为这可能是加载问题，但这并没有帮助。然后我添加了imagesLoaded，这也没有做任何事情。

我附上了图像如何加载的屏幕截图。谢谢！

Answer 1

检查您正在使用flickity.pkgd.js，而不仅仅是flickity.js.

检查您的选项是否设置正确

// with jQuery
$('.gallery').flickity({
  imagesLoaded: true
});

-

// or with vanilla JS
new Flickity( '.gallery', {
  imagesLoaded: true
});

-

<!-- or in HTML -->
<div class="gallery js-flickity" data-flickity-options='{ "imagesLoaded": true }'></div>