用jquery.animate和jquery.scrolltop垂直滾動內容

Question

我正在研究這個滾動元素以顯示隱藏內容的plugin。

但我不能作出正確的，例如，

1. 當我滾動達到號碼7,8內容，我想回一個步驟，之前滾動僅能達到數字5， 6但它滾動達到號碼1,2。

2. 達到最高號碼1,2誤後，它滾動直降達到數字8,9當我再次點擊more按鈕。

我該如何解決？

這裏是插件代碼，

(function($){ 

    $.fn.extend({ 

     scroll_up_down: function(options) { 

      var defaults = { 
       associateScroller:   '.less', 
       scrollTarget:    '.items-thread', 
       scrollAmount:    40, 
       callback:      function() {} 
      } 

      var options = $.extend(defaults, options); 
      var o = options; 
      var scroll_amount = o.scrollAmount; 
      var associate_scroller = o.associateScroller 


      var $cm = this.click(function(e){ 

       // Set the varible. 
       var object = $(this); 
       var scroll_target = $(o.scrollTarget); 

       scroll_target.animate({scrollTop:scroll_amount}, 500); 

       scroll_amount += o.scrollAmount; 


       return false; 

      }); 

      var $cm_2 = $(associate_scroller).click(function(e){ 

       // Set the varible. 
       var scroll_target = $(o.scrollTarget); 

       scroll_target.animate({scrollTop:-scroll_amount}, 500); 
       scroll_amount -= o.scrollAmount; 


       return false; 
      }); 



     } 
    }); 

})(jQuery); 

Answer 1

問題是可變scroll_amount。首先，它總是滾動回頂端，因爲你傳遞負面！滾動量。你不想這樣做。其次，您應該在動畫之前而不是之後修改滾動量。

http://jsfiddle.net/CxbYf/2/

scroll_amount = ...; 
scroll_target.animate({scrollTop:scroll_amount}, 500);