沒有間隙的連續滑塊動畫jQuery

Question

我試圖創建一個連續的滑塊圖像，它自己循環，我已經成功地獲得它的工作，但我現在面臨的問題是有很大一部分轉換與空白空間直到圖像圈又一輪

我正在尋找一種方式，我可以得到圖像循環端到端所以在過渡期沒有差距，在此先感謝

http://jsfiddle.net/Antifaith/tqBMQ/

編輯：

好吧，我嘗試了單獨的圖像，但它使我的大腦出血，所以我採取了另一種方法，試圖在動畫中的某個位置觸發if語句 - 現在只有問題是觸發slidetown（） ;一秒鐘超過一百萬次，並停止工作 - 今天早上我已被分配到別的東西，真的可以使用一些幫助！

http://jsfiddle.net/Antifaith/tqBMQ/1/

$(document).ready(function slidetown(){ 
$('.rotation').animate({'left' : '960px'} , { 

    duration: 15000, 
    easing : "linear", 
    complete: function() { 
     $(this).css('left','-2028px'); 
     slidetown(); 
    } 
    }); 
var pos = $('.rotation').position(); 
     if (pos.left < 0) { 
      slidetown(); 
     } 
}); 

Answer 1

我認爲伎倆可能是使用，而不是一個大的多張圖片。您遇到的問題是動畫在圖像離開您爲動畫指定的960像素區域之前不會重新啓動。但是，如果您在正確的位置剪切圖像（我建議計算圖像中的邏輯上下文分解），則第一個圖像應該在頁面到達時再次離開頁面序列。