Slide up e down per righe tabella

[Alhazred]

Ho bisogno di mostrare e nascondere righe di una tabella con un'animazione.
Attualmente con questo codice riesco a mostrare/nascondere le righe, ma senza animazione

<table class="table">
    <tr class="header">
        <th>Prima riga</th>
    </tr>
    <tr>
        <td>Oratio me istius philosophi non offendit; Duo Reges: constructio interrete.</td>
    </tr>
    <tr class="header">
        <th>Seconda riga</th>
    </tr>
    <tr>
        <td>Oratio me istius philosophi non offendit; Duo Reges: constructio interrete.</td>
    </tr>
</table>

<script>
    $(document).ready(function() {
        $('.table .header').on("click", function() {
            $(this).toggleClass("active", "").nextUntil('.header').css('display', function(i, v) {
                return this.style.display === 'table-row' ? 'none' : 'table-row';
            });
        });
    })
</script>

Non so quanto siano alte le righe della tabella perché il contenuto cambia dinamicamente secondo l'input degli utenti, quindi non posso indicare quanti px deve coprire l'animazione.
Come posso risolvere?

[KillerWorm]

La cosa non è così scontata. L'ingombro di una tabella, e suoi relativi elementi, è determinato dal proprio contenuto.
Un trucco, infatti, è quello di utilizzare un ulteriore div che avvolga il contenuto di ciascun td (o th), quindi lavorare su questo.

Potresti partire da una roba del genere:

<table class="table" >
    <tr class="header">
        <th>Prima riga</th>
    </tr>
    <tr>
        <td><div>Oratio me istius philosophi non offendit; Duo Reges: constructio interrete.</div></td>
    </tr>
    <tr class="header">
        <th>Seconda riga</th>
    </tr>
    <tr>
        <td><div>Oratio me istius philosophi non offendit; Duo Reges: constructio interrete.</div></td>
    </tr>
</table>

<script>
    $(document).ready(function() {
        $('.table .header').on("click", function() {
            $(this).toggleClass("active", "").nextUntil('.header')
            .find('>td>div').slideToggle();
        });
    })
</script>

Eventualmente potresti anche creare il div al volo con una cosa tipo .wrapInner('<div />'), ma in tal caso andranno fatte opportune considerazioni.

[Alhazred]

Grazie, col trucchetto del div sono riuscito a farlo funzionare anche senza js, sfruttando solo la classe collapse di bootstrap.