我如何添加类一旦我的动画已经完成

How do I addClass once my animation has finished?

本文关键字：动画 我的 何添加 添加      更新时间：2023-09-26

我想在动画结束时添加一个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。changecolordiv只是一个例子。我并不是想要改变颜色。我希望能够在动画结束时或动画过程中为box添加不同的类。 
.box {
    position:absolute;
    width:100px;
    height:100px;
    background-color:#A3D900
}
.change {
    background-color:red;
}

一切工作，包括添加类，但我想在动画结束时添加类

试试这个:

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

简单添加complete回调。

Demo: http://jsfiddle.net/x27Ar/1/

相关文章：