行を詰めるアニメーション

現在、<table>タグでリストを作り、削除ボタンを押すと<tr>が削除される、というものを作っていて、
その一連の動きをなるべくアニメーションさせたいと思っています。
削除ボタンを押すと行を横にスライドさせて削除した後、後に続く行をスライドさせて上に詰めるという動きにしたいのですが、いまいちやりかたが分かりません。(特に上に詰める動作)
jquery,cssで実装したいと思っているのですが、何かヒントでもいただけると嬉しいです…

●追記
すみません。コードはこれです。
今はfadeoutで<tr>を消していますが、スライドさせて消すときはcssのクラスを与えて、Animate.cssなどでアニメーションさせれば良いのかなと思っています。

php
1<table class="table">
2<!-- 配列をループ処理してます -->
3foreach($hoge_list as $key => $value){
4	<tr id="list_{$key}">
5		<td><a href="/">リスト名</a></td>
6		<td><button type="button" class="delete" value="{$value}">削除</button></td>
7	</tr>
8｝
9</table>
10
11

javascript
1$(function() {
2	$('.delete').click(function() { 
3        var val = $(this).val(); 
4        var id = $(this).parents("tr").attr("id"); 
5	        $.post('delete.php', {
6	            val: val
7		         }, function() { 
8		       $('#'+id).fadeOut(400);
9	        }); 
10	}); 
11});