關於前端圖片輪播問題

網上普遍的一種圖片輪播方式我看見有用appendTo方式，每次將第一個圖片放到最後，並將left設置爲0，這種是可以實現的，若要圖片無縫鏈接需要將ul的寬度設置很大，但這種方式輪播有個缺陷就是無法掌控輪播的順序，當你添加按鈕左右切換時會亂，所以輪播只需將i控制就可以了，設置left爲-i*100px，i點擊和輪播時變化。

 var s = setInterval(lb, 3000);
            function lb() {
               
                $("#lb ul").animate({
                    "margin-left": "-"+(i+1)*100+"%"
                }, function () {
                    
                    i++;
                    if (i == 4) {
                        i =0;
                    }
                    
                    xb.css("background-color", "chartreuse");
                    xb.eq(i).css("background-color", "white");
                    $("#lb ul li").eq(0).appendTo("#lb ul");
                    $("#lb ul").css("margin-left", "0");
                })