Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery table column sliding effect

I will need a Jquery script for a table sliding effect just like

http://sfsdirectdemo.projects.sourceflow.com/luke (middle plan table)

I Google it but have not any good result, anyone please help.

like image 799
Michael Avatar asked Feb 12 '11 08:02

Michael


2 Answers

Here's an example that I believe does what you want:

http://jsfiddle.net/nheldman/GB7Hc/3/

The trick is to create an outer div with the width of the table you want to show, and an inner div that is the width of all of the columns that could be displayed if you slide.

Then you can just use jQuery animate() to scrollLeft the outer container by the width of each column.

Good luck!

like image 177
Noah Heldman Avatar answered Nov 02 '22 18:11

Noah Heldman


I had to do a very similar thing at one point. Here is a jsfiddle that I used to figure out the code. Hop it helps. http://jsfiddle.net/mstarkman/U7JHM/9/

like image 41
Mark S. Avatar answered Nov 02 '22 19:11

Mark S.