1

I'm trying to smoothly remove the first tr of my table by doing:

$("#table_id").children().first().fadeOut('slow');

But the tr just disappears without any nice effect. Actually, this is not working either for any jQuery effect (slideUp, animate, hide('slide', ...), etc).

Any thoughts of how to solve this issue?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Santiago
  • 261
  • 3
  • 7

3 Answers3

3

I've seen this on divs before - not sure if it's the same issue with a tr. However, try putting filter:inherit; on the tr.

Dan Blows
  • 20,846
  • 10
  • 65
  • 96
1

IE8 apparently doesn't handle the smooth fade and exhibits the behaviour you describe, whereas Chrome worked fine.

Adding filter: inherit inline seems to do the trick, although it's a dirty workaround: Demo

If you've got nested tables, then you can use eq(0) instead of :first-child to match the specific row:

$("#table_id tr:eq(0)").fadeOut('slow');
Town
  • 14,706
  • 3
  • 48
  • 72
  • Thanks for the answers. Actually, my table structure is more like [this]http://jsfiddle.net/5YjKV/, and see what happens. All the tr are hidden now :-/ – Santiago Apr 18 '11 at 13:01
  • Thanks. It sort of worked, but I had to wrap the elements with
    to make slideUp work: http://jsfiddle.net/NmQFJ/
     – Santiago Apr 18 '11 at 15:11
  • @Sam: Animations (other than fadeIn and fadeOut) [aren't supported on table rows](http://stackoverflow.com/questions/467336/jquery-how-to-use-slidedown-or-show-function-on-a-table-row), so that'll be why. – Town Apr 18 '11 at 16:07
0

Make sure you have not set jQuery.fx.off to true since it will disable all of the jquery animations.

suhair
  • 10,895
  • 11
  • 52
  • 63