如何在每次點擊時增加animate（）中的整數

Question

如何在每次點擊時增加animate()的整數值？

例如，

HTML，

<ul class="items-thread"> 
    <li class="item-thread">1</li> 
    <li class="item-thread">2</li> 
    <li class="item-thread">3</li> 
    <li class="item-thread">4</li> 
    <li class="item-thread">5</li> 
    <li class="item-thread">6</li> 
    <li class="item-thread">6</li> 
    <li class="item-thread">7</li> 
</ul> 
<a href="#" class="more">more</a> 

jQuery的，

$('.more').click(function(){ 
    $('.items-thread').animate({scrollTop:50}, 500); 
    return false; 
}); 

當我第一次點擊按鈕的.items-thread的元素將被向上捲動50px，當我點擊第二次按鈕，則應該向上滾動100px等等。

Answer 1

使用一個變量，增加每次點擊的價值：

var scrollAmount = 50; 
$('.more').click(function(){ 
    $('.items-thread').animate({scrollTop:scrollAmount}, 500); 
    scrollAmount += 50; 
    return false; 
}); 

Answer 2

像這樣的事情會做到這一點。

$('.more').click((function(){ 
    var nScrollTop = 0; 

    var animate = function() { 
     nScrollTop += 50; 
     $('.items-thread').animate({scrollTop: nScrollTop}, 500); 
     return false; 
    }; 

    return animate; 
})()); 

Answer 3

只使用 「+ =」

看到這個撥弄它增加了50 PX利潤率左每個點擊 http://jsfiddle.net/pixelass/eKkZ4/

$('.more').click(function(){ 
    $('.items-thread').animate({marginLeft: '+=50px'}, 500); 
    return false; 
});