Swiper Thumbs(缩略图) - thumbs

thumbs组件专门用于制作带缩略图的swiper,比使用controller组件更为简便,且在loop状态下更友好。

thumbs信息

类型:
object
启用版本:
4.4.0

效果演示

使用方法示例

从Swiper7开始,容器默认类名由'.swiper-container'变更为'.swiper'。
<script language="javascript"> 
var thumbsSwiper = new Swiper('#thumbs',{
  spaceBetween: 10,
  slidesPerView: 4,
  watchSlidesVisibility: true,//防止不可点击
})
var gallerySwiper = new Swiper('#gallery',{
  spaceBetween: 10,
  thumbs: {
    swiper: thumbsSwiper,
  }
})
</script>