javascript - Swiper.js - 转换完成时添加类

Question

我在文档中找不到有关在幻灯片加载后立即添加类的信息。问题是swiper.js添加了'swiper-slide-active'类，但是在滑动的时候！当幻灯片完成动画时，我需要添加一些类......就像幻灯片动画结束后的“空闲”一样。

有可能吗？

var mySwipper = new Swiper('.my-swiper', {
  slidesPerView: 3,
  slidesPerColumn: 2,
  spaceBetween: 30,
  slidesPerGroup: 3,
  speed: 800,
  autoplay: {
    delay: 3000
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
<div class="my-swiper">
  <div class="swiper-slide">
    <span>1</span>
  </div>
  <div class="swiper-slide">
    <span>2</span>
  </div>
  <div class="swiper-slide">
    <span>3</span>
  </div>
</div>

标签： javascripthtmljqueryswiper

Answer 1

如果其他人正在寻找，我找到了解决方案。

swiper.on('slideChangeTransitionEnd', function () {
//do something
}