iDangerous Swiper 2：改变第一个和第二个箭头的CSS /样式最后幻灯片？

Question

我严格使用较旧版本的 Swiper（v2.7.6）以及 jQuery（v1.10.1）

我尝试在第一张或最后一张幻灯片处于活动状态时更改左右箭头的不透明度。 （如果在第一张幻灯片上，左箭头将是较低的不透明度，如果在最后一张幻灯片上，则与右箭头相同。

如果中间的幻灯片，箭头将恢复完全不透明。
不幸的是，经过几个小时我无法解决这个问题。

这是我当前的jQuery代码：

if ($(".swiper-slide:eq(0)").hasClass("swiper-slide-active")) {
  $(".arrow-left").css("opacity","0.2");
}
else {
  $(".arrow-left").css("opacity","1");
}

HTML是：

<div class="swiper-container">
  <a class="arrow-left" href="#"></a> 
  <a class="arrow-right" href="#"></a>

  <div class="swiper-wrapper">
    <div class="swiper-slide"></div>
    <div class="swiper-slide"></div>
    <div class="swiper-slide"></div>
  </div>

</div>

可以找到Swiper 2的API文档here。

谢谢。

Answer 1

我认为Swiper已经为您处理了这个问题，只需在创建swiper实例时指定包含箭头的html元素

(function () {
var swiper = new Swiper('.swiper-container', {
    nextButton: '.arrow-right',
    prevButton: '.arrow-left',
    ...

}); 
})(jQuery);