Swiper のスライダーの表示がうまくできない。

Question

Swiper のスライダーで質問です。

最初に表示した時も最後にも常に３枚表示されている状態にするにはどうすれば良いでしょうか？
デモで入っていた240-effect-coverflow.htmlをもとに作成しました。
よろしくお願いいたします。

▼テストで作成したページです。（関係のないタグが入っていますが、そこは無視してください。）
https://xincx-design.com/callcenter/test.html
≪CSS追加≫

<style> .swiper-container { width: 100%; padding-top: 50px; padding-bottom: 50px; } .swiper-slide { background-position: center; background-size: cover; width: 500px; height: 300px; } .swiper-slide img { width: 500px; height: 300px; } </style>

≪JSオプション≫

<script> var swiper = new Swiper('.swiper-container', { effect: 'coverflow', grabCursor: true, centeredSlides: true, slidesPerView: 'auto', coverflowEffect: { rotate: 50, stretch: 0, depth: 100, modifier: 1, slideShadows : true, loop : false, }, autoplay: { delay: 4000, disableOnInteraction: true, }, pagination: { el: '.swiper-pagination', }, }); </script>

Answer 1

loopをtrueにして繰り返すのとは少し違いますでしょうか？

var swiper = new Swiper('.swiper-container', {
  loop: true, //追加
  effect: 'coverflow',
  grabCursor: true,
  centeredSlides: true,
  slidesPerView: 'auto',
  ...
  ...
}

Comments

[TakaeOhta]

ご回答ありがとうございました。 loop: trueを追加してできました。ただ、なぜか最新版のだとうまくいかず、次のタグに変えたらできました。<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.1/css/swiper.min.css">と<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.1/js/swiper.min.js"></script>
ただ、スピードがすごく早くなってしまいました。最初に入れたのは最新版をダウンロードしたのを入れましたが、バージョンによっても違いもあるんですね。。。

もう少し試してダメなら違うタイプので以下のにする事にしました。ありがとうございました。
↓
https://xincx-design.com/callcenter/content.html