I am working with JSF pages and the Primefaces framework. Ultimately, it writes xHTML. The effect I am after is allowing a user to see a limited number of columns in a table and if they choose show the rest of the columns onClick of a button. For example, the initial time a user comes to the page the table is presented as 6 columns for each record. If the user wishes to see all 100 columns the user clicks an expand button which will reveal. Similarly if the user wants to get a limited view a click on a different button will collapse the view back to 6 columns. This transition would be nice it if was a fade or slider. I do not want a on/off switch. Any insight or link to working example? Thanks.
Are you seriously creating a table with 100 columns?
One thing you could do is use a wrapper with overflow: hidden to crop the columns that you want to hide. Then you just need to transition the widths of the heading cells of the first 6 columns to collapse / expand.
Thank you for the advice. I know it is ridiculous. I solved this issue. Instead of using a dynamic table I am toggling back and fourth with a fade transition between 6 and the rest of the columns. The client at this time does not know what they want. So it is actually for demonstration purposes.
This topic is now closed. New replies are no longer allowed.