jQuery圖片滾動圖片的效果

 1、當移動的最後一屏移動的個數小於要展示的個數的時候 ，只移動(展示個數-最後一屏的個數的)差值。 舉個例子： 每一屏都要展示7個，但總個數才10個，滾動到下一屏時候使用者看到的還是7個，這個時候需要移動的是三個

 這個效果是基於jQuery寫的，只是想紀念下自己的學習 話不多說了，貼代碼  代碼如下:(function( $ ){var slider = function( elem , args ){this.config = $.extend({effect : 'x', //效果 水平 - xspeed : 600 , //動畫速度trigger : 'mouseenter', //觸發事件callback : null , // 回呼函數view : 7 }, args || {} ); this.history = [];//記錄移動的記錄this.index = 0;this.el = elem;this.length = this.el.find('li').length;//記錄總長度this.width = this.el.find('li').eq(0).outerWidth();//記錄每一個單項的寬度this.init();}slider.prototype = {constructor : slider,init : function(){this.bindEvents();},bindEvents : function(){this.prev();this.next();},prev : function(){this.el.find('[data-type="left"]').click( $.proxy(function(){ if( !this.history.length ) return;//如果記錄為空白，證明沒有進行移動過,所以直接return this.index--;var step = this.history.pop();//取最後的移動步驟var move = step * this.width;//算出移動寬度this.el.find("ul").animate( { "left" : "+="+move+"px" } , this.config.speed ) } , this));},next : function(){this.el.find('[data-type="right"]').click( $.proxy(function(){//如果是當前的最後一頁,直接returnif(this.index == parseInt( this.length / this.config.view , 10 ) ){return;}this.index++;//這個計算很重要//計算 ( 下一頁 * view ) 展示個數是否大於總長度 : 好比當前在第一頁 (1+1) *7 > 12(總長度)//則this.step 賦值為取餘 ,也就是剩下要移動的個數if( this.config.view * (this.index+1) > this.length ){this.step = this.length%this.config.view;}else{//否則移動展示的個數this.step = this.config.view;}//記錄移動的記錄this.history.push(this.step);var move = -1 * this.step * this.width; this.el.find("ul").animate( { "left" : "+="+move+"px" } , this.config.speed ) } , this)); }} $.fn.slider = function( args ){return this.each(function(){var el = this;var plugins = new slider( $( el ) , args );$(el).data("slider" , plugins );});}})(jQuery)  開始對這個實現沒有好的想法，本來想利用一個變數記錄當前的移動個數的，但是後面突然想到用數組來做這樣子的處理，頓時感覺清晰了。 這個的實現重點是一個記錄移動步驟的數組。向左移動的時候往數組裡面push移動的步驟，向右移動的時候，從數組裡面取最後一項 [].pop()。 這樣子很好的實現了需求，做的比較粗糙，麻煩各位大神提點意見