1
Swiper 5で3Dホイールをシミュレートするカスタム効果
無限に回転する3Dホイールをシミュレートする12項目のカルーセルを作成する必要があります。明確にするために、私はこの効果を正確に作成する必要があります： https://codepen.io/SitePoint/pen/yXWXaw（ここにあります） ただし、これらの追加機能を使用すると（特にデスクトップおよびモバイルでは）、次のようになります。 スライドはスワイプの手順を追う必要があります。つまり、スライドはスワイプ中に移動する必要があります（Swiperと同じ）。 速いスワイプで、勢いのある多くのスライドをスクロールするはずです（Swiperがで行うように freeScroll）。 次に、ホイールが回転を停止すると、（Swiperがと同様freeModeStickyに centeredSlides）前のスライドにスナップし、ユーザーから選択されたものになります。 slideChanged（Swiperのように）スライドが変わるたびに（のようなイベント）コールバックが必要です。 これらすべての理由から、Swiper 5.3.0が良い出発点になると思いました。 私はさまざまな回避策を試しましたが、この設定の方が優れていますが、これloop: trueはひどい回避策であり、問題を引き起こします（コメントを確認してください）。 var swiper = new Swiper(el_class, { slidesPerView: 1.5, spaceBetween: 25, centeredSlides: true, grabCursor: true, speed: 550, loop: true, // <== repeat infinitely the 12 items. with fast scroll at the end of a cycle it waits a …