前提・実現したいこと
サムネイル付きスライドショーで、最後のサムネイルに行くと、そこから続いていくようにloopさせていきたい。
ここに質問の内容を詳しく書いてください。
模写として、読売巨人さんの公式ホームページを作っています。
swiper.js中のDEMOにあったサムネイル付きスライドショーを応用しloopさせているのですが、画面内の最後の画像に行き次のloopで、その画像が初期値(左側から)から始まってしまいます。
実現したいことは前述の通りですが、詳しく述べると最後の画像まで行くと、次の隠れている画像にいくために一個づつloopさせたいということになります。
発生している問題・エラーメッセージ
エラーメッセージ
該当のソースコード
ソースコード
let galleryThumbs = new Swiper('.gallery-thumbs', {
spaceBetween: 0,
slidesPerView: 5,
loop: true,
freeMode: true,
autoplay: {
delay : 6000,
disableOnInteraction: true
},
speed : 900,
followFinger : false,
loopedSlides: 5, //looped slides should be the same
watchSlidesVisibility: true,
watchSlidesProgress: true,
grabCursor : true,
});
let galleryTop = new Swiper('.gallery-top', {
spaceBetween: 0,
loop: true,
autoplay: {
delay : 6000,
disableOnInteraction: false
},
speed : 900,
followFinger : false,
touchRatio : 2,
loopedSlides: 5, //looped slides should be the same
thumbs: {
swiper: galleryThumbs,
},
});
試したこと
ここに問題に対して試したことを記載してください。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
あなたの回答
tips
プレビュー