JorgeV44
JorgeV44

Reputation: 71

jQuery animate help

This isn't working. I'm trying to replicate the animate to red and then remove effect as in the WordPress admin. The element gets removed, but it doesn't animate before that.

$('.delete-item').live('click', function(){
            $(this).parent().parent().animate({backgroundColor: '#ff0000'}, 'slow').empty().remove();
        });

Upvotes: 3

Views: 130

Answers (2)

Sarfraz
Sarfraz

Reputation: 382696

As for as i know you can not animate the background color, you need the color plugin in order to do that.

Upvotes: 3

Nick Craver
Nick Craver

Reputation: 630409

Use the .animate() callback, like this:

$('.delete-item').live('click', function(){
  $(this).parent().parent().animate({backgroundColor: '#ff0000'}, 'slow', function() {
    $(this).empty().remove();
  });
});

The callback won't execute until the animation is complete, your current method queues the animation but only executes one frame of it before the element is removed from the DOM, this lets the entire animation execute then remove it.

Upvotes: 1

Related Questions