Lock or Freeze Table Columns plus Non-Scroll Headers

Lock or Freeze Table Columns plus Non-Scroll Headers
(Internet Explorer CSS solution)

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.

Brett Merkey

Some aesthetic tweaks and a Drag and drop variation

Other experiments

Name	Major	Sex	English	Japanese	Calculus	Geometry
Student01	Languages	male	80	70	75	80
Student02	Mathematics	male	90	88	100	90
Student03	Languages	female	85	95	80	85
Student04	Languages	male	60	55	100	100
Student05	Languages	female	68	80	95	80
Student06	Mathematics	male	100	99	100	90
Student07	Mathematics	male	85	68	90	90
Student08	Languages	male	100	90	90	85
Student09	Mathematics	male	80	50	65	75
Student10	Languages	male	85	100	100	90
Student11	Languages	male	86	85	100	100
Student12	Mathematics	female	100	75	70	85
Student13	Languages	female	100	80	100	90
Student14	Languages	female	50	45	55	90
Student15	Languages	male	95	35	100	90
Student16	Languages	female	100	50	30	70
Student17	Languages	female	80	100	55	65
Student18	Mathematics	male	30	49	55	75
Student19	Languages	male	68	90	88	70
Student20	Mathematics	male	40	45	40	80
Student21	Languages	male	50	45	100	100
Student22	Mathematics	male	100	99	100	90
Student23	Languages	female	85	80	80	80

“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

http://web.tampabay.rr.com/bmerkey/examples/locked-column-csv.html