[不具合] Swiperのスライダーが高速回転してしまう の原因と対策

スライダー実装用のJavaScriptプラグインであるSwiper.jsで実装したページで、スライダーが超高速回転してしまう、というバグが起きました。

症状が出る人と、出ない人がいる、ということで調べたところ、

1. Windows設定の「Windowsにアニメーションを表示する」がオンになっていると発動するっぽい

2. iPhoneだと、[設定]→[アクセシビリティ]→[動作]→[視差効果を減らす] ががオフになっていると、発生するっぽい

1の「Windowsにアニメーションを表示する」

ということまでわかりました。

1,2のオン/オフで高速回転したりしなかったりするらしいので、再現できない場合は、試してみて下さい。

じゃあどう対応したら、は、コーダー任せだったので詳しく追っていませんが、https://manidesign.jp/2021/07/01/swiper-prefers-reduced-motion/ の[解決法]が対策のようです。

https://manidesign.jp/2021/07/01/swiper-prefers-reduced-motion/ より
(参照元ブログが消えることがあるので、キャプチャさせて頂きました)

ほぼ情報が無さそうだったので。ちなみに、今回使用したのはSwiper v8.4.4でした。

Swiperでカルーセルが爆速回転してしまう、する環境としない環境がある、というときは、ぜひ試してみて下さい。

追加情報などあれば、ぜひコメントお願いします！