Swiper Loop(循环) - loopedSlides

在loop 模式下使用 slidesPerview:'auto' ,还需使用该参数设置所要用到的loop 个数(一般设置大于可视slide个数2个即可)。

loopedSlides信息

类型:
number
默认:
1
举例:
3
启用版本:
4.0.0

效果演示

可视slide有3个,loopedSlides可设为5个或以上

slider1
slider2
slider3
slider4
slider5
slider6
slider7
slider8

使用方法示例

从Swiper7开始,容器默认类名由'.swiper-container'变更为'.swiper'。
<div class="swiper">
  <div class="swiper-wrapper">
    <div class="swiper-slide">slider1</div>
    <div class="swiper-slide">slider2</div>
    <div class="swiper-slide">slider3</div>
    <div class="swiper-slide">slider4</div>
    <div class="swiper-slide">slider5</div>
    <div class="swiper-slide">slider6</div>
    <div class="swiper-slide">slider7</div>
    <div class="swiper-slide">slider8</div>
  </div>
</div>
<script> 
  var mySwiper = new Swiper('.swiper', {
    loop: true,
    slidesPerView: 'auto',
    loopedSlides: 5,
  })
</script>