在动画完成后应用 CSS 规则 jQuery

Question

我希望能够使用 jquery 添加一个 css 属性\value，但我想等到动画先制作完毕，然后我希望 css 通过将其显示值设置为 none 来删除动画。

这是我的代码片段。

**Jquery**
 $(".filled-rectangle").animate(); 
 $(".filled-rectangle").css('display', 'none'); 

Answer 1

您可以使用

.promise（） 和 .done（） 方法在当前动画队列的末尾添加动作：

$(".filled-rectangle").animate().promise().done(function() {
    $(".filled-rectangle").css('display', 'none');
});

如果你想允许其他代码添加回调，在动画完成后调用，这将非常有用，因为你可以返回 .promise（） 方法返回的承诺。

或者，您可以使用 .queue（） 将回调添加到动画队列本身中：

$(".filled-rectangle").animate().queue(function(next) {
    $(".filled-rectangle").css('display', 'none');
    next();
});