jquery - 单击时 LI 的动画位置

Question

我确定我在这里遗漏了一些愚蠢的东西，但我看不到它。
应该发生的是，对于垂直列表，当单击 LI 时，它会向右移动 10px，如果单击另一个 LI，则它会向后移动，并且单击的 LI 向右移动。
这在列表中运行良好，但如果我回到前一个 LI，前一个选择的 LI 会按原样向后移动，但单击的 LI 没有动画，所以当你来回单击时，LI 会继续向后移动

$("#navig li").click(function(){
$("#navig li.selected").animate({ 
        left: "-=10px",
      }, 300 );
    $("#navig li.selected").removeClass("selected")

    $(this).addClass("selected")
    $(this).animate({ 
        right: "-=10px",
      }, 300 );
})

Answer 1

你需要这样的东西吗？

http://jsfiddle.net/v3LWL

$("#navig li").click(function(){
    var $this  = $(this),
        el = $this.siblings().filter(".selected");

    el.animate({left: 0}, 300, function(){
        $(this).removeClass("selected");
    });

    $this.animate({left: 10}, 300, function(){
        $(this).addClass("selected");
    });

});

Answer 2

如果您调整left正负，则对其他条件执行相反的操作，但对相同的位置属性执行此操作left。