javascript - 如何使用 jquery animate 来回移动多个元素

Question

我一直在研究以下代码，以便来回移动 div 但是当切换 div 时似乎存在问题，一旦单击一个元素，它就会切换但它会影响何时单击下一个元素.任何关于使这个元素来回平等地切换，并且只向左或向右一步的建议。 这是我的 fiddle https://jsfiddle.net/z3L8wbt6/

var move = 200;
$('#main div').click(function(){
    $(this).animate({
        left: "+="+move
    }, 200);
    move =-move;
});

Answer 1

使用 jQuery 函数 addClass、removeClass 和 hasClass，我创建了一个简单的 if/else 语句来控制每个 div 独立于其他 div 移动。

if ($(this).hasClass("moved")) {
    move = -200;
    $(this).removeClass("moved");
} else {
    move = 200;
    $(this).addClass("moved");
}
$(this).animate({
   left: "+=" + move
}, 200);

JSFiddle