將自定義箭頭添加到滑塊

我在MODX網站上有ms2Gallery。我想添加一些功能（添加左右按鈕）。將自定義箭頭添加到滑塊

<div class="large-12 medium-12 columns main_page_preview text-center"> 
      <div class="main_page_title large-8 medium-8 large-offset-2 medium-offset-2 columns"> 
       <h1>NAME</h1> 
      </div> 

      <div id="msGallery"> 
    <div class="large-12 medium-12 columns" style="max-height: 845px; overflow: hidden; margin-bottom: 15px;" href="/assets/images/resources/33/banya-10.jpg"> 
    <img src="/assets/images/resources/33/banya-10.jpg" width="100%" alt="" title="" id="mainImage"> 
    </div> 
    <div class="clearfix"></div> 
     <div class="large-2 medium-2 columns"> 
    <a href="/assets/images/resources/33/banya-01.jpg" class="thumbnail" data-image="/assets/images/resources/33/banya-01.jpg"> 
     <img src="/assets/images/resources/33/360x270/banya-01.jpg" alt="" title="banya_01.jpg" width="100%" data-id=""> 
    </a> 
</div> 
<div class="large-2 medium-2 columns"> 
    <a href="/assets/images/resources/33/banya-04.jpg" class="thumbnail" data-image="/assets/images/resources/33/banya-04.jpg"> 
     <img src="/assets/images/resources/33/360x270/banya-04.jpg" alt="" title="banya_04.jpg" width="100%" data-id=""> 
    </a> 
</div> 
<div class="large-2 medium-2 columns"> 
    <a href="/assets/images/resources/33/banya-06.jpg" class="thumbnail" data-image="/assets/images/resources/33/banya-06.jpg"> 
     <img src="/assets/images/resources/33/360x270/banya-06.jpg" alt="" title="banya_06.jpg" width="100%" data-id=""> 
    </a> 
</div> 

     <a href="javascript:void(0)"><img src="build/img/prev-left.png" class="left-arrow-gallery" id="leftarrow"></a> 
     <a href="javascript:void(0)"><img src="build/img/next-right.png" class="right-arrrow-gallery" id="rightarrow"></a> 
     </div>

爲了解決這個問題，我創建了這個js代碼：

var clicks= 0; 
$('#rightarrow').on('click', function(){ 
    clicks += 1; 
    $(".thumbnail").eq(clicks).trigger("click"); 
}) 
var leftClicks = $('.thumbnail').length; 
    $('#leftarrow').on('click', function(){ 
    leftClicks -= 1; 
    $(".thumbnail").eq(leftClicks).trigger("click"); 
})

但我想降低元素在左邊點擊，無論我有多少次點擊右箭頭。

來源

2015-10-30 Maximus Dredoff

var clicks = 0; 
var leftClicks = 0; 
var _ElementCount = $(".thumbnail").length; 
$('#rightarrow').on('click', function(){ 
    clicks = _ElementCount ? clicks = 0 : clicks += 1; 
    $(".thumbnail").eq(clicks).trigger("click"); 
}) 
var leftClicks = $('.thumbnail').length; 
    $('#leftarrow').on('click', function(){ 
    leftClicks = 0 ? clicks = _ElementCount : clicks -= 1; 
    $(".thumbnail").eq(leftClicks).trigger("click"); 
})

來源

2015-12-02 17:41:43 Alexandr

將自定義箭頭添加到滑塊

回答

相關問題