slick

無限ループスライダー

右から左 (デフォルト方向)

script
                  
      $('.slider.slider-type01').slick({
        autoplay: true, //自動でスクロール
        autoplaySpeed: 0, //自動再生のスライド切り替えまでの時間を設定
        speed: 5000, //スライドが流れる速度を設定
        cssEase: "linear", //スライドの流れ方を等速に設定
        slidesToShow: 5, //表示するスライドの数
        swipe: false, // 操作による切り替えはさせない
        arrows: false, //矢印非表示
        pauseOnFocus: false, //スライダーをフォーカスした時にスライドを停止させるか
        pauseOnHover: false, //スライダーにマウスホバーした時にスライドを停止させるか

        responsive: [
          {
            breakpoint: 768, //768px以下
            settings: {
              slidesToShow: 2.5,
            }
          }
        ]
                  
                

左から右 (逆方向)

※「rtl: true」のオプションを有効にするには、 スライドのコンテナに「dir='rtl'」属性を付与する必要があります。

html
                  
                    // 「class="slider"」の箇所に 「dir="rtl"」を付与

                    <div class="slider" dir="rtl">
                  
                
script
                  
                    //下記のオプションを追加する

                    rtl: true, //逆方向にスライドさせる