Splide

Splide

・公式サイト

Splideは、軽量かつ高機能なスライダー（スライドショー）ライブラリで、Webサイトの画像・コンテンツのスライド表示を簡単に実装できます。
特に、アクセシビリティ（Accessibility・アクセシビリティ対応）に配慮されており、SEO対策やユーザーの利便性向上にも適しています。

Swiper（スワイパー）と比較しても、軽量でありながら多くの機能を備えているのが特徴
従来はSwiperでしか実現できなかった機能も、最近のアップデートによりSplideでも可能になってきました。

Swiperよりも軽量な上に、スライダーに求められる機能がそろってきた
Splideは29KB
Swiperはバンドル版で約140㎅（それぞれのバージョンにもよる）
日本語ドキュメントが充実している

「React、Vue、Svelte」にも対応している

基本的な使い方

script
                  
                      new Splide('.splide').mount();
HTML
                  
                    

                      

                        
    
                          
    • 
                          
    • 
                          
    • 
                          
    • 
                          
    •

「type: 'loop'」：ループ（カルーセル）スライダー

script
                  
                      new Splide('.splide', {
                        type: 'loop'
                      }).mount();

「rewind」：スライダーの終わりまで行ったときに、先頭に巻き戻せるかどうかを決定

script
                  
                      new Splide('.splide', {
                        rewind: true
                      }).mount();