One workaround is to wrap the contents of each TD in a DIV. Hide those
divs and then slide them down. The only other thing I would suggest is
to use fadeIn() instead.
--Karl
____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Mar 28, 2009, at 7:17 AM, Jsbeginner wrote:
Hello,
I'm trying to use the jquery slidedown function with table rows but
it does not work as jquery defines them with display:block which
places the whole row in the first colomn and makes the whole table
layout go wrong ...
Do you have any suggestions how to get around this ?
Here's my code :
$("#tableid tbody").append("<tr style=\"display: none\" id=
\"rownum"+TotalRows+"\"><td>"+data.rowone+"</td><td>"+data.rowtwo+"
</td><td>"+data.rowthree+"</td></tr>");
$("#rownum"+TotalRows).slideDown();
This code is placed in an ajax request success function and I would
like the new row to slidedown and not just appear...
Here is the html code generated by the slideDown function :
<tr style="display: block;" id="rownum1"><td>Data 1</td><td>Data 2 </
td><td>Data 3</td></tr>
It's the display: block that make the layout not work in Firefox
etc... If you don't think it's possible to do this then it's not the
end of the world, I just thought it would look nicer for not much
more code ...
Thankyou.