Question

我正在使用此slider并关闭循环，但我遇到的问题是显示第一张和最后一张幻灯片的导航箭头。我正在找麻烦找到一种方法来传达左箭头应隐藏在第一张幻灯片上，右箭头隐藏在最后一张幻灯片上。

您可以使用mySwiper.getFirstSlide() / mySwiper.getLastSlide()定位这些特定幻灯片，然后隐藏各自箭头的显示吗？或者设置获取数组的长度并指定每个箭头以隐藏它是否是该列表中的第一个或最后一个？

我不确定这些是否正确。我对任何建议持开放态度。

http://codepen.io/NewbCake/pen/sIbxi

Answer 1

试试这个，

$('.arrow-left').hide()  
var mySwiper = new Swiper('.swiper-container',{
    loop:false,
    onSlideChangeEnd: function () {
      $('.arrow-left').show()
      $('.arrow-right').show()
       if(mySwiper.activeIndex==0){
       $('.arrow-left').hide()
       }
      if(mySwiper.activeIndex==mySwiper.slides.length-1){
      $('.arrow-right').hide()
      }
    }

  })
  $('.arrow-left').on('click', function(e){
    e.preventDefault()
   // alert(mySwiper.previousIndex)
    mySwiper.swipePrev()
  })
  $('.arrow-right').on('click', function(e){
    e.preventDefault()
    mySwiper.swipeNext()
  })

以下是演示链接http://codepen.io/dhana36/pen/LbHzn

选择要隐藏的元素，如果数组中的第一个或最后一个

1 个答案: