貓頭鷹Carrousel滾動問題

Question

我正在使用貓頭鷹旋轉木馬，我正嘗試將一張幻燈片換成下一張幻燈片，點擊名爲「現在投票」在貓頭鷹旋轉木馬上的按鈕「，但有一個問題，當我點擊第二個DOT並單擊在「投票現在」按鈕的第4個位置上，它切換到幻燈片的第3個位置，它的確定，但是幻燈片的第4個位置隱藏了，我想要它只向後滾動一個幻燈片，並且還可以看到幻燈片的第4個位置

Here is my fiddle link Can任何人都可以幫到我嗎？

$(window).load(function(){ 
    var animating = false; 
    $('#container').on('click', '.click', function() { 
     var clickedDiv = $(this).closest('div.ddd'), 
     prevDiv = clickedDiv.prev(), 
     distance = clickedDiv.offset().left - prevDiv.offset().left; 
     if (prevDiv.length) { 
      animating = true; 
      $.when(clickedDiv.animate({ 
      left: -distance 
      }, 1000), 
      prevDiv.animate({ 
      left: distance 
      }, 1000)).done(function() { 
      prevDiv.css('left', '0px'); 
      clickedDiv.css('left', '0px'); 
      clickedDiv.insertBefore(prevDiv); 
      animating = false; 
      }); 
     } 
    }); 
}); 

Answer 1

// owl carousel 
$(document).ready(function() { 
    var slider = $('.owl-carousel'); 
    slider.owlCarousel({ 
    items: 4, 
    loop: false, 
    center: false, 
    margin: 10, 
    callbacks: true, 
    URLhashListener: true, 
    autoplayHoverPause: true, 
    startPosition: 'URLHash', 
    touchDrag: false, 
    mouseDrag: false 
    }); 
    $(".swap").click(function() { 
    slider.trigger('prev.owl.carousel'); 
    }); 
})