Responsive (Swiper slide)

Allows to set different parameter for different responsive breakpoints (screen sizes).

This option appears in most sections that contain sliders.

{
  // when window width is >= 0px
  "0": {
    "slidesPerView": 1,
    "spaceBetween": 20
  },
  // when window width is >= 320px
  "320": {
    "slidesPerView": 1,
    "spaceBetween": 20
  },
  // when window width is >= 768px
  "768": {
    "slidesPerView": 2,
    "spaceBetween": 20
  },
  // when window width is >= 992px
  "992": {
    "slidesPerView": 3,
    "spaceBetween": 20
  },
  // when window width is >= 1200px
  "1200": {
    "slidesPerView": 4,
    "spaceBetween": 20
  }
}

Last updated