Slide table rows

This is a fork of http://jsfiddle.net/PGKLd/3/ written by gion_13 which in turn is a solution proposed to this question: http://stackoverflow.com/questions/7468802/how-to-slide-a-table-down-to-one-row-in-jquery

HTML

<table id="table">
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>
    <tr id="test"><td>6</td></tr>
    <tr><td>7</td></tr>
    <tr><td>8</td></tr>
</table>

CSS

table{
    width : 300px;
}
tr{
    height : 50px;
    background-color : red;
}
tr:hover{
    background-color :green;
    cursor : pointer;
}
td{
    text-align : center;
}

JavaScript

$('#table tr').click(function() {
    $this = $(this);
    if ($this.siblings('tr:visible').length === 0) {
        $this.siblings('tr').slideDown();
    } else {
        $this.siblings('tr').slideUp();
    }
});