In Internet Explorer 5.0+ (Windows), this table has a non-scrolling header with the option to create a locked column for horizontal scrolling.
This solution is very lightweight and easy to maintain. No scripts are used to produce the effects, except one-line IE expressions applied through the style sheet.
The column locking is accomplished entirely by means of styling which can be applied by a static assignment of a CSS class to the cells of the locked column, or as in this example, by dynamically toggling the class upon user action. Waiting for explicit user action to lock the column has the effect of speeding the display of large tables.
“I just wanted to offer a big thank you for your column locking solution. It looks like it's on its way to 'saving our project,' at least in my usability-conscious eyes.”
Jack Bellis Usability Institute
“It's true! Gee wizz, every time I think I know it all, bamm! Right between the eyes.”
Big John Position is Everything
Note: For very large tables, avoid performance problems by applying Internet Explorer's client-side data binding feature to divide data tables into "pages" with a set number of visible rows. This means that scripts and styles have only to act on the visible portion of the table, dramatically improving performance. Using data binding, tables with 1200 rows and 20 columns were tested with absolutely no performance issues.