Question

var sliderThumbs = new Swiper('.slider .slider-thumbs', {
            slidesPerView: 'auto',
            });
          var slidercontent = new Swiper('.slider .slider-content', {
            disableOnInteraction: false,
            thumbs: {
              swiper: sliderThumbs,
            },
          });

将滑动更改为拇指悬停

无法使用以下代码

$('.swiper-slide.thumb-slide').hover(function() {
      $( this ).trigger( "click" );
   });

我该为我的英语不好对不起

Answer 1

$( this ).trigger( "click" )不起作用，因为缩略图幻灯片实际上没有绑定click事件。相反，您可以调用slideTo()方法并使用缩略图的索引，如下所示：

$('.swiper-slide').on('mouseover', function() {
    slidercontent.slideTo($(this).index());
})

请参阅以下内容：

滑动器API方法：https://swiperjs.com/api/#methods
jQuery的.index()方法：https://api.jquery.com/index/

如何滑动滑块鼠标悬停分页

1 个答案: