Javascript 如何设置按钮的动画

一个小问题。。。我想！ 我有一个按钮菜单。单击时，它会移动（设置动画）。当另一个被点击时，我需要第一个再次返回。 到目前为止，它们只在单击时移动，但不会再次返回。 守则：

$(document).ready(function(){
  var vari = $(this).attr('name');
    $('.nav_btn').click(function(){
  $(this).animate({left:'50%'});
    });
}); 

---

请尝试在此处使用

.sibbins（）

：

$(document).ready(function(){
    var vari = $(this).attr('name');
    $('.nav_btn').click(function(){
        $(this).animate({left:'50%'});
        $(this).siblings().animate({left: '0'});
    });
}); 

---

虽然不是必需的，但您可以提供动画的

动画持续时间。
使用jQuery，这对我来说似乎很容易。您要做的是，为所有按钮指定相同的类名，并在单击其中一个按钮时循环遍历所有按钮。因为您可以获得元素集合，所以看起来非常像：

$(document).ready(function(){
  var vari = $(this).attr('name');

  $('.nav_btn').click(function(){
     var buttons = $('.nav_btn');
     for(var i=0; i<buttons.length; i++) {
         if(buttons[i]!=this)         //Avoid animating clicked button twice! Think of performance
           $(buttons[i].animate({left:'0%'});
     }
     $(this).animate({left:'50%'});
  });
}); 

$（文档）.ready（函数（）{
var vari=$（this.attr（'name'）；
$（'.nav_btn'）。单击（函数（）{
变量按钮=$（'.nav_btn'）；
对于（var i=0；i