jQuery animate()将div向右移动,然后向左移动,点击

Question

我试图让div向右滑动然后向左滑动.我目前有这个代码,但它向右滑动,然后立即向后滑动,没有第二次点击.我也试图实现切换,但最终打破了脚本.我感觉如此接近,但似乎无法指出它.

$(function(){
    $("#click").click(function(){
        $("#click").animate({left:'+=100px'}, 'fast');
    });

    $("#click").click(function() {
        $("#click").animate({left:'0'}, 'fast');
    });
});

Answer 1

jsBin演示

var c=0;
$("#click").click(function(){
    $(this).stop().animate({left: ++c%2*100 }, 'fast');
});

为了解释这个解决方案背后的数学原因:
每次点击之后,var c获得预先递增,所以基本上在10次点击c后将== 10使用模数 10%2 = 0,如果你继续点击数学是:
11%2 =1
12%2 =0
13%2 =1
14%2 =0. ..等等,
如果你乘以1乘以100 = 100(需要100px)和每个偶数(0*100)将导致我们的0px!

或者像这样:

var dir = 0;
$("#click").click(function(){
     dir = dir===0 ? 100 : 0;
     $(this).stop().animate({left: dir }, 'fast');
});