[JavaScript][CSS] animacja tabeli w css Opcje

[lolarz]

Js:

Kod

function home () {
    var trBottom = document.getElementById('trBottom');
    var classes = trBottom.className.split(' ');
    var index = classes.indexOf('On');
    if (index == -1) {
        classes.push('On');
    } else {
        classes.splice(index, 1);
    }
    trBottom.className = classes.join(' ');
}

html:

Kod

<table>
<tr id="trTop">
<td>1</td>                      
</tr>
        
<tr id="trBottom">
<td>2</td>
</tr>
</table>
<div onclick="home()"></div>

css:

Kod

#trBottom {
    vertical-align: top;
}
#TrBottom.On {
    height: 92px;
}

Czy jest jakiś sposób żeby zrobić animacje zmiany wysokości/szerokości <tr> albo <td>? kombinuje już od godziny, ale nic na razie się nie udało. Kombinowałem z tym i z tym, ale ani to ani to nie działało. Dzięki z góry za odp, jeżeli się pojawią (IMG:style_emoticons/default/smile.gif)