How can I swiper Js scroll continuously without pasue like a ticker slide?

Question

  <div className="w-100 mt-lg-0 mt-2">
    <Swiper
      loop
      grabCursor
      freeMode
      speed={1000}
      slidesPerView="auto"
      spaceBetween={30}
      centeredSlides={true}
      autoplay={{
        delay: 0,
        disableOnInteraction: false,
      }}
      breakpoints={{
        "@0.00": {
          slidesPerView: 1,
          spaceBetween: 10,
        },
        "@0.75": {
          slidesPerView: 2,
          spaceBetween: 20,
        },
        "@1.00": {
          slidesPerView: 3,
          spaceBetween: 40,
        },
        "@1.50": {
          slidesPerView: 4,
          spaceBetween: 50,
        },
      }}
      modules={[Autoplay, Pagination, Navigation]}
      className="mySwiper rounded-4 hero-swiper"
    >
      {data.map((item, index) => (
        <SwiperSlide key={index}>
          <div className=" max-w-screen-xl mx-auto">
            <div className="bg-black">{item.title}</div>
          </div>
        </SwiperSlide>
      ))}
    </Swiper>
  </div>

My current code is scrolling continuously but I don not know why it is pausing after each scroll. I need it to continue without pausing as like ticker scroll

My current code is scrolling continuously but I don not know why it is pausing after each scroll. I need it to continue without pausing as like ticker scroll

Answer 1

You need to set the loop parameter to true. Will be the same for a lot of the other parameters like freeMode.

loop={true}

    <Swiper
      loop={true}
      speed={1000}
      slidesPerView="auto"
      spaceBetween={30}
      centeredSlides={true}
      autoplay={{
        delay: 0,
        disableOnInteraction: false,
      }}
      modules={[Autoplay]}
    >