swiper.jsで、スマホ画面でスライド表示枚数を変えたい
PC画面ではスライド表示数を4枚、スマホ画面でがスライド表示数を1枚にしたい。
発生している問題・エラーメッセージ
PC画面では上手く表示されますが、デベロッパーツールでスマホ画面に変えると、swiperが動かなくなります。その際、ブラウザの再読み込みを行うと、スマホ画面でもswiperが動きます。
ブラウザの再読み込みが必要なのでしょうか?コードに不備があるのでしょうか?
該当のソースコード
$(function() { var mySwiper = new Swiper('.swiper-container', { spaceBetween: 20, slidesPerView: 1, loop: true, autoplay: { delay: 3000, disableOnInteraction: true }, breakpoints: { 640: { slidesPerView: 4, spaceBetween: 30, loop: true, autoplay: { delay: 3000, disableOnInteraction: true }, } } }); });
試したこと
Swiper APIで調べて、Breakpointsを参照しました
補足情報(FW/ツールのバージョンなど)
Swiper API
ドキュメントに「Such parameters like loop and effect won't work.」と書いてあるのが気になりました。
あなたの回答
tips
プレビュー