删除第一张和最后一张幻灯片SwiperJS的效果

Posted 2021-04-12

我已经将swiper slide与coverflow效果集成在一起，现在我不想要第一张和最后一张幻灯片的效果。我们可以删除第一个和第一个幻灯片的效果。???

答案

当您在第一个选项卡中时，您可以检查您的位置并禁用“刷到上一个”，当您在最后一个选项卡时，可以“滑动到下一个”。像这样，

        var swiper = new Swiper('.swiper-container', {
            effect:'coverflow',
            pagination: '#progressbar',
            paginationType: 'progress',
            nextButton: '#next-button',
            prevButton: '#prev-button',
            spaceBetween: 30,

            onInit: function (swiper) {
                if (swiper.activeIndex == 0)    swiper.lockSwipeToPrev(); 
                if (swiper.isEnd)               swiper.lockSwipeToNext(); 
            },

            onSlideChangeStart: function (swiper) {
                if (swiper.activeIndex == 0)    swiper.lockSwipeToPrev(); 
                else                            swiper.unlockSwipeToPrev(); 

                if (swiper.isEnd)               swiper.lockSwipeToNext(); 
                else                            swiper.unlockSwipeToNext(); 
            },
        });

另一答案

我想你的意思是slideShadows财产。如果是这样，您可以轻松地显示/隐藏它，如下所示：

var mySwiper = new Swiper('.swiper-container', {
  coverflowEffect: {
    rotate: 30,
    slideShadows: false,
  },
});