Question

我试图在动画结束时添加一个CSS类。在这里，我有一个基本动画，可以移动div类box，添加边框半径并更改背景颜色。在这结束时，我想添加一个名为changecolor的类。一切正常，但在点击div box时添加了类。

$(document).ready(function() {
    var e = $('.box');
    e.click(function() {
        e.animate({left: '200px'}, 2000);
        e.animate({borderRadius: '100px'}, 2000);
        e.animate({backgroundColor: '#22222'}, 1000);
        e.addClass('changecolor');
    });
});

这是我的CSS。 changecolor div就是一个例子。我并不是想改变颜色。我希望能够在动画结束时或者在动画期间为框添加不同的类。

.box {
    position:absolute;
    width:100px;
    height:100px;
    background-color:#A3D900
}
.change {
    background-color:red;
}

一切正常，包括添加类，但我希望在动画结束时添加类。

Answer 1

试试这个：

 e.animate({backgroundColor:'#22222'},1000, function() {
    e.addClass('changecolor');
    // Animation complete.
  });

只需添加complete callback。

演示：http://jsfiddle.net/x27Ar/1/

动画完成后如何addClass？

1 个答案: