如何在每次点击时增加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
,依此类推。
答案 0 :(得分:3)
只需使用“+ =”
看到这个小提琴,每次点击都会增加50 px的余量 http://jsfiddle.net/pixelass/eKkZ4/
$('.more').click(function(){
$('.items-thread').animate({marginLeft: '+=50px'}, 500);
return false;
});
答案 1 :(得分:1)
这样的事情就可以做到。
$('.more').click((function(){
var nScrollTop = 0;
var animate = function () {
nScrollTop += 50;
$('.items-thread').animate({scrollTop: nScrollTop}, 500);
return false;
};
return animate;
})());
答案 2 :(得分:0)
使用变量,并在每次点击时增加其值:
var scrollAmount = 50;
$('.more').click(function(){
$('.items-thread').animate({scrollTop:scrollAmount}, 500);
scrollAmount += 50;
return false;
});