Swiper

無限ループスライダー

右から左　（デフォルト方向）

CSS
                  
/* スライドの動きをスムーズにさせる */
.swiper-wrapper {
  transition-timing-function: linear;
}
script
                  
    window.onload = function () {
      const swiper = new Swiper(".swiper.slider-type01", {
        loop: true,
        autoplay: {
          delay: 0, //自動再生を有効にして、切替時の遷移遅延は０秒に指定
          pauseOnMouseEnter: false, //ホバー時にスライドを止めるか否かの指定
          disableOnInteraction: false, //ホバー時にスライドを止めるか否かの指定
        },
        speed: 2000, //移動するスピード

        //スライドの表示枚数
        slidesPerView: 3,
        breakpoints: {
          // 769px以上の場合
          769: {
            slidesPerView: 5,
          },
      });
    }

左から右　（逆方向）

「autoplay」の中に「reverseDirection: true,」を追加。これで逆方向の動きの指定する

script
                  
    window.onload = function () {
      const swiper = new Swiper(".swiper.slider-type02", {
        loop: true,
        autoplay: {
          delay: 0, //自動再生を有効にして、切替時の遷移遅延は０秒に指定
          pauseOnMouseEnter: false, //ホバー時にスライドを止めるか否かの指定
          disableOnInteraction: false, //ホバー時にスライドを止めるか否かの指定

          reverseDirection: true, //逆方向の動きの指定
        },
        speed: 2000, //移動するスピード

        //スライドの表示枚数
        slidesPerView: 3,
        breakpoints: {
          // 769px以上の場合
          769: {
            slidesPerView: 5,
          },
      });
    }