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>