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
codice:
<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?