CODEWITHSUNDEEP
javascriptjquery
mrblah
mrblah

Reputation: 103517

Removing a table row using jquery, fading and changing color slightly

I have a button that when clicked, gets the row in the table that was clicked on. 

$("#someId").remove();

I want to highlight the row that is being deleted, and fade it out (it is being deleted).

Is there a way to do this with jQuery?

I tried a fadeout with remove, but that didn't achieve what I wanted.

$("#someId").fadeOut("slow").remove();

Upvotes: 7

Views: 8109

Answers (3)

zombat
zombat

Reputation: 94177

In order to do highlighting, you'll need to check out color animations. There is an official JQuery color plugin that you can get in order to do color change animations with the animate function. Once you have it, you should be able to accomplish everything in a manner similar to this:

$("#someId").animate( {backgroundColor:'yellow'}, 1000).fadeOut(1000,function() {
    $('#someId').remove();
});

Upvotes: 8

ak3nat0n
ak3nat0n

Reputation: 6288

If you are trying to change the color of the row without any color transition effect you could add a class to the row being deleted before starting the delete process.

  $("#someId").addClass('hilite').fadeOut('slow', function() {
     $('#someId').remove();
  });

where you would have defined hilite as

.hilite{ background-color:orange;}

Upvotes: 1

user142019
user142019

Reputation:

The highlight part, I don't know, but the fade out part:

$("someId").fadeOut(1000,function()
{
    $(this).remove();
});

Which does a callback: http://docs.jquery.com/Effects/fadeOut

Upvotes: 2

Related Questions