当特定方向上没有更多图像时隐藏 swiper js 导航按钮左和右

问题描述

当特定方向上没有更多图像时，如何隐藏 swiper js 导航按钮（左和右）

例如。如果没有正确方向的图像，则应隐藏右侧导航按钮。

解决方法

使用 jQuery，您可以执行以下操作：

if (swiper.activeIndex===0) {
  $('.left-slide').hide()
  $('.right-slide').show()
} else if (swiper.activeIndex === swiper.slides.length-1) {
  $('.left-slide').show()
  $('.right-slide').hide()
}

第一个条件是第一张幻灯片

,

我找到了一个使用 CSS 的简单解决方案

.swiper-button-disabled{
    display:none;   
}

当该方向没有图像时，这将自动隐藏该方向的导航按钮。