javascript - 在开始新动画之前清除所有使用 jquery 动画所做的更改

Question

我使用 jQuery 动画来为一些 div 设置动画。我有什么方法可以清除在动画第二个 div 之前对第一个 div 所做的所有更改？

      $(".order-b").click(function(event){
        $(".order-t").animate({top:'30%'}, "slow" );
      });

      $(".counsel-b").click(function(){
        $(".counsel-t").animate({top:'30%'}, "slow" );
      });


<div class="process-bars">
   <!-- first DIV -->
   <div class="order-b">
      <div class="order-t">
          <i class="fa fa-shopping-cart"></i>
          <h1>Order</h1>
      </div>                                      
   </div>

   <!-- Second DIV -->
   <div class="counsel-b">
      <div class="counsel-t">
          <i class="fa fa-shopping-cart"></i>
          <h1>Order</h1>
      </div>                                        
   </div>
</div>

CSS 代码:

.order-t, counsel-t {
position:absolute;
top:52%;
width: 100%;
margin:0 auto;
z-index:2;

我想在单击第二个 div 时清除第一个 div 的动画。我怎样才能做到这一点？!我不想像下面的代码那样做:

     $(".order-b").click(function(event){
        $(".order-t").animate({top:'30%'}, "slow" );
        $(".counsel-t").animate({top:'52%'}, "slow" );
      });

Answer 1

如本答案所示:https://stackoverflow.com/a/9398960/1585362 , 要清除已通过 jquery 添加到元素的 css，您可以使用以下命令:$('.element').removeAttr('style');