jQuery Infinite Carouselの最後の画像が消えないようにするにはどうすればよいですか？

Question

私はこのjQuery Infinite Carouselを使用していますが、デモとは多少異なる方法で、私の使用方法hereの「Customer Success Stories」の見出しに記載されています。

私はカルーセルを中心にしていて、カルーセルがスクロールされると以前のイメージが見えるようにしています。カルーセルが最初にロードされるとき、シーケンス内の最後のイメージはロードされないので、最初のイメージの左側に空白があります。カルーセルが最初の画像に戻ると、最後の画像も一時的に消えます。

私はこれを何度も修正しようとしましたが、jQueryの知識は不足しており、スクリプトはただ応答を停止します。カルーセルがロードされて消えないときに、それは再び最初に到達する？ありがとう。ここで

は、jQueryのスクリプトです：

/** 
* @author Stéphane Roucheray 
* @extends jquery 
*/ 


jQuery.fn.carousel = function(previous, next, options){ 
    var sliderList = jQuery(this).children()[0]; 

    if (sliderList) { 
     var increment = jQuery(sliderList).children().outerWidth("true"), 
     elmnts = jQuery(sliderList).children(), 
     numElmts = elmnts.length, 
     sizeFirstElmnt = increment, 
     shownInViewport = Math.round(jQuery(this).width()/sizeFirstElmnt), 
     firstElementOnViewPort = 1, 
     isAnimating = false; 

     for (i = 0; i < shownInViewport; i++) { 
      jQuery(sliderList).css('width',(numElmts+shownInViewport)*increment + increment + "px"); 
      jQuery(sliderList).append(jQuery(elmnts[i]).clone()); 
     } 

     jQuery(previous).click(function(event){ 
      if (!isAnimating) { 
       if (firstElementOnViewPort == 1) { 
        jQuery(sliderList).css('left', "-" + numElmts * sizeFirstElmnt + "px"); 
        firstElementOnViewPort = numElmts; 
       } 
       else { 
        firstElementOnViewPort--; 
       } 

       jQuery(sliderList).animate({ 
        left: "+=" + increment, 
        y: 0, 
        queue: true 
       }, "swing", function(){isAnimating = false;}); 
       isAnimating = true; 
      } 

     }); 

     jQuery(next).click(function(event){ 
      if (!isAnimating) { 
       if (firstElementOnViewPort > numElmts) { 
        firstElementOnViewPort = 2; 
        jQuery(sliderList).css('left', "0px"); 
       } 
       else { 
        firstElementOnViewPort++; 
       } 
       jQuery(sliderList).animate({ 
        left: "-=" + increment, 
        y: 0, 
        queue: true 
       }, "swing", function(){isAnimating = false;}); 
       isAnimating = true; 
      } 
     }); 
    } 
}; 

Answer 1

このプラグインは、可能な限り自動化することを意図している、これは非常にいくつかのオプションがあります。私はあなたがあなたのCSSを変更するだけであなたが望むものを達成できると思います。 #customersCarouselは、3つのアイテムと同じ大きさでなければならず、左端の勾配によって部分的に隠されていない場合、最初の要素の左端が意図される場所に配置する必要があります。この最初の項目はリストの最初の項目になります。 #customersCarouselListの右余白を取り除きます（自動サイズと位置の処理に矛盾することがあります）。次に、グラデーションイメージを変更して、最初のアイテムの左側と3番目のアイテムの右側を非表示にします。 このヘルプが必要です。