...

View Full Version : Script.aculo.us: How to slide up a table row?



Terran
12-29-2010, 11:45 AM
Having problems sliding a table row using scriptaculous. Using the code new Effect.SlideUp('test1');, the table row gets hidden but without the animation effects.

While trying to research this, I saw a post in stackoverflow and someone said it's really hard to create animated effect for table rows. There's a solution there but it's for jQuery.

Another solution is probably to use <div id="test1"> inside the <tr> instead but that creates XHTML error.

Code for table table row:

<tr id="test1"><td>Hello World!</td></tr>

Terran
01-10-2011, 11:44 PM
Seeing no one was able to answer this, I assume it's impossible to do. Any alternative solution?

barkermn01
01-11-2011, 03:56 PM
Erm, Tables and Javascript are not the easy way to do it,
IE makes it 10 times harder to play with tables than any other browser aswell,

I find it easyer to use DIVs and replicate a Table with CSS
E.G


<style>
.table{
width:400px;
}
.tr{
clear:both;
}
.td{
float:left;
width:100px;
}
/* override example */
.w200{
width:200px;
}
</style>
<div class="table">
<div class="tr">
<div class="td">Hello</div>
<div class="td">World</div>
<div class="td">From</div>
<div class="td">Table</div>
</div>
<div class="tr">
<div class="td w200">Hello</div>
<div class="td">From</div>
<div class="td">Table</div>
</div>
</div>


Then you can attach an ID to a row(tr) or cell(td) and javascript can play with it easier
All so gives you much more flexibly with styling



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum