Locked Table Headers

This is a demo of javascript that allows you to lock the header row and column of an html table. By fixing the headers, it makes browsing through a large table easier. Tested in IE6+, FF2+, Safari3+. Fails in Opera. Using a separate sorter script for table sorting.

Scroll below the table for useable information.

Header 0	Header 1	Header 2	Header 3	Header 4	Header 5	Header 6	Header 7	Header 8	Header 9	Header 10	Header 11	Header 12	Header 13	Header 14	Header 15	Header 16	Header 17	Header 18	Header 19	Header 20	Header 21	Header 22	Header 23	Header 24	Header 25	Header 26	Header 27	Header 28	Header 29	Header 30	Header 31	Header 32	Header 33	Header 34	Header 35	Header 36	Header 37	Header 38	Header 39	Header 40	Header 41	Header 42	Header 43	Header 44	Header 45	Header 46	Header 47	Header 48	Header 49
Row 0	4905	2684	5482	1130	5467	3619	2534	5457	5792	1336	3566	1190	1464	2093	365	4873	5454	1184	4567	261	3664	653	5624	685	5870	314	3823	3972	1215	4708	3163	4867	4700	3320	1672	688	4671	1397	532	212	1277	2816	3917	3084	1410	4932	4194	3743	389
Row 1	1642	282	796	5338	4788	2497	3793	2960	5643	3491	769	1057	3225	982	165	5748	4018	2913	2935	886	5716	3979	2127	1646	799	5475	781	4088	2701	2048	4515	240	2743	1085	5234	5351	2153	851	4052	1903	5376	4073	613	2989	2872	1246	2188	2374	1699
Row 2	1872	2525	2063	1036	5537	2917	2368	3705	327	3331	5282	5945	2955	1342	1234	3603	3809	2297	4510	590	4474	1351	4573	851	3833	4670	1629	1949	3	4633	352	3533	3501	3344	4611	1022	3748	3649	4493	1450	5888	2131	4670	3703	5239	5843	837	2051	2298
Row 3	1915	5704	2193	1186	704	1892	2684	2133	5752	3457	1657	3585	1980	234	1131	1325	3378	3654	211	776	163	5643	3654	2546	830	1101	3729	4037	1539	652	5058	2519	1283	1870	4807	1991	3175	4237	5607	3570	3993	3544	3847	3666	3372	5319	5647	5512	5839
Row 4	1345	1479	1904	4004	2235	1656	3870	576	2918	4245	5691	4869	3740	4928	5155	854	1647	5685	2371	5832	5152	549	5383	3302	3890	3986	3657	1925	479	571	2318	469	4051	3661	3182	2486	4358	5361	2128	2890	2229	2194	2461	4880	1645	5641	1054	2508	5110
Row 5	5528	2325	3987	3993	5634	2752	257	2394	1120	995	1558	2712	2525	2259	518	3451	4215	1915	4533	1856	1249	2143	4690	2161	5973	5048	2915	3739	3389	5958	3921	3144	1876	983	5879	4242	1225	3854	723	4429	3085	5884	5969	4941	3702	3815	1995	1660	2810
Row 6	868	2537	460	120	2035	1384	1831	1367	4935	2636	5181	2310	5900	4701	1720	397	4945	4322	4760	85	1617	2426	4130	3764	1829	3921	2193	1537	4444	566	66	832	1199	3040	5497	5885	1036	4272	5364	5186	2041	1133	5196	1639	2045	4298	972	3206	992
Row 7	4469	5646	1603	155	3838	4036	4932	2716	2387	1110	119	5001	2391	5058	4625	1788	1667	5011	2652	4842	4568	3420	1866	5904	2189	952	5051	5614	1009	5213	5040	4030	447	5739	4951	4877	18	5989	587	355	5160	1029	3908	3817	4482	3972	946	5534	2641
Row 8	5766	3324	2111	3930	5326	3144	2229	5961	2102	4272	1289	5946	5012	2430	206	1432	5730	2502	2894	290	5541	3238	5277	479	1928	5606	2873	63	5014	5719	216	3331	5171	1827	521	5697	5347	864	5070	2592	4564	4822	5817	4006	5616	2316	2204	4182	2052
Row 9	2426	378	3497	3493	1833	2178	1299	3383	2255	4037	2726	801	265	698	1070	3570	3465	542	385	1368	4163	3311	3134	1855	2178	2544	3818	1167	5562	134	1014	4197	4309	2037	4039	1204	437	1324	2825	4395	1566	3111	3861	4238	2664	1125	4885	119	1475
Row 10	1806	3412	3436	5004	4826	4412	1972	3537	3482	5011	998	1904	5640	2956	5849	829	4251	1991	1175	4830	3023	5808	787	1530	5798	4538	3931	132	4488	5636	5008	5134	3877	5307	550	1178	5195	1266	302	332	5488	2908	4002	3462	4863	2844	2449	85	5983
Row 11	3921	3249	5625	1760	2248	2816	4523	1245	1525	1382	2888	847	807	2368	3235	1562	608	3758	3314	3154	973	2558	1195	3956	4814	3173	3193	2691	4083	852	317	91	2739	139	2951	5106	2079	5808	2833	1084	5445	1992	3507	1972	4854	3207	1623	2301	5588
Row 12	1250	4166	893	1669	4001	5204	2441	6	2478	697	2840	3009	5071	2771	5924	2073	2743	1887	2378	2801	4300	2096	163	2054	776	2702	2785	2962	2905	2721	1720	409	806	5796	1175	4791	3327	2279	3633	5453	5311	5467	130	2808	2682	788	5175	658	3236
Row 13	5474	2177	590	4896	75	5195	1550	171	5533	3683	4576	4343	276	2668	4206	3418	2364	3284	1604	41	1523	1207	3578	3982	5263	4135	8	1551	2412	5099	2023	5736	1296	61	4581	1570	4248	13	4871	4201	2458	1947	4309	1327	3442	143	2143	1828	1966
Row 14	579	1048	4260	3374	865	3688	4196	642	2847	5669	1617	5273	3158	228	1146	27	2427	232	1549	4191	2123	248	2332	3468	5433	4585	3629	5183	4592	4480	1410	5009	766	5043	5137	3579	1564	3513	2610	3044	3142	4148	647	2962	5773	3979	5596	3905	336
Row 15	2445	2301	3455	1185	39	2046	1903	4570	2440	3733	2465	4783	4672	1018	80	4685	1979	1831	3990	3824	1215	1109	2496	633	3557	2472	693	2925	5695	4574	4648	343	2563	5602	2571	4233	5022	3065	5918	4911	2505	2680	2230	1959	632	4676	761	1375	2983
Row 16	3531	1031	735	5155	2894	2721	4898	3494	2349	519	2579	2099	3600	2315	13	4288	5455	4652	4172	4101	4742	5469	2657	2833	5529	2080	3543	2995	997	1928	3688	1750	3099	2493	4209	4832	5102	1700	3420	3876	3587	1958	3010	984	3539	4676	1530	4705	2943
Row 17	5348	4264	1536	314	3703	3449	5885	275	5147	4944	4849	5178	3833	2746	5774	1005	77	1184	1395	469	1379	3047	4869	1979	657	4635	3697	5319	5917	3260	5003	4508	5885	234	200	3475	3108	1992	5041	1610	1724	2073	3942	1852	3898	1792	1351	1865	227
Row 18	3339	3130	3017	3559	28	1055	3875	3330	4188	5640	4751	1699	426	2007	750	5274	1402	3000	536	3715	2505	5383	1920	1835	3026	650	4663	1317	2400	4691	866	1761	4182	839	5452	2126	1287	1143	1102	1932	1307	2321	935	1855	2315	3827	3240	5557	3374
Row 19	3571	4418	151	3510	1775	4005	83	4713	3189	2224	4675	4218	4865	3366	4111	5891	71	4766	5570	953	2753	5131	2501	1431	4974	5275	1779	2552	5992	5677	146	3859	973	3032	4678	173	1566	3933	226	2288	1940	4623	4438	5865	5758	2897	5561	5367	5446
Row 20	4613	189	4361	1819	4932	4726	2046	1337	2047	1046	4216	1022	1211	2505	4300	4376	2396	2138	1438	1632	4696	1336	3703	932	3582	5425	4327	5643	2773	1133	2814	1352	1237	5571	3804	1508	3792	2163	4560	3680	827	4322	904	1512	19	2033	2518	4943	5962
Row 21	5092	4278	1172	624	5068	715	4981	4224	5402	1603	4358	3452	2621	4852	1011	493	2872	1471	5798	3247	3013	97	3371	148	1671	1723	5063	4864	4229	4744	3346	5368	3488	329	2982	4313	3537	1022	5432	537	4702	2355	5989	3562	3905	5801	4383	3876	3142
Row 22	5767	1505	4645	880	2074	522	640	2826	2430	5528	615	4995	4490	1570	2352	5388	169	3812	4764	2217	2088	4520	4722	2031	1544	1545	3421	4748	462	4083	465	4705	2286	4256	106	4018	353	2537	1677	3465	5783	105	1657	2293	2969	256	4038	3563	2307
Row 23	4804	2752	3090	5980	2814	2973	4368	1861	2182	4372	164	5617	3474	2340	4700	348	5314	2250	1114	3831	2328	5120	5619	5553	619	2569	541	1134	3316	3368	3840	2571	2747	3475	943	3636	1056	1406	5818	2111	1345	2434	5065	1838	5972	2391	4952	5437	4699
Row 24	1718	3924	4123	2236	1891	410	1021	2919	3165	4923	3102	172	4679	2187	3339	2070	5856	5318	3413	4149	3385	918	403	2754	2209	4119	5749	5103	3467	5886	2802	3222	3138	4026	2482	1465	4534	80	150	5918	278	5772	5844	5159	3817	2679	1726	4493	2744
Row 25	80	3232	5266	4433	619	5512	1892	1162	5662	3287	1832	1526	1372	4449	2735	2319	2391	4897	3854	5118	4181	5227	4405	69	3635	4978	4370	4287	4074	3096	1999	5103	554	268	2121	4967	2223	5093	343	1837	1755	3778	180	1785	5925	5084	3679	5745	3328
Row 26	468	5520	992	2137	5058	5764	2556	1680	4208	1096	3561	2359	4889	1963	1992	845	1642	5299	1393	1102	5151	2305	263	4396	3376	5595	3570	1792	973	4036	3674	4224	4957	2286	2839	2187	5818	4679	2073	2116	2238	4578	104	5663	4916	5022	1492	5196	2940
Row 27	3732	3619	4926	33	4499	5532	3027	1599	5238	2887	5456	4346	744	1752	3273	1315	2653	198	3914	4129	5283	5824	1692	2067	4790	2587	752	5902	83	2719	5076	4423	4935	2201	2614	5540	3013	4905	4594	635	2870	2981	4251	3860	2761	2940	5146	2818	3275
Row 28	2162	4926	5883	1553	1782	4300	1887	279	821	1007	1200	4752	54	5832	3581	1098	4409	5156	4897	2425	5653	5381	5577	4124	5492	1727	3541	2378	1358	509	3206	1272	3151	811	4664	3445	461	2340	3768	3819	2757	2856	4329	799	1583	4482	1091	373	1294
Row 29	2707	1500	117	1798	2551	4844	898	375	3346	5836	1680	4286	1642	4350	1188	1580	3434	5446	1605	2422	5724	5916	642	1986	5126	3523	1747	2061	5451	168	5730	4747	5649	2055	1033	5524	2746	700	2774	1354	3332	1750	4941	1857	1858	2461	5165	4883	52
Row 30	2831	350	1958	3396	1071	4954	480	5880	1215	620	993	315	1616	2520	1957	4291	4139	5656	5808	2050	2743	4179	2937	5017	1594	2007	5073	3674	5898	4253	5781	1876	817	3950	307	5958	77	4618	2384	3267	3423	3397	3941	4347	836	5590	1833	1352	3087
Row 31	3428	4336	2453	2184	1872	5789	93	5460	706	3222	837	3844	1614	2686	1383	217	3849	4445	5243	3604	4805	623	641	400	3873	649	2470	3754	4311	17	5571	2160	2390	2717	5651	732	1497	1955	5635	2131	542	5408	2527	4986	3719	1986	3695	542	5203
Row 32	5461	811	2350	2027	1776	4234	2408	5086	3524	5885	4132	2118	1639	5317	4739	15	5274	1040	4959	4488	1258	3652	5468	3320	4141	3462	2191	3497	2146	28	3846	3054	5419	379	1733	1141	1208	4127	1862	242	3200	1149	3243	4529	2276	4951	2254	5847	5045
Row 33	3509	3692	5502	1365	2922	1780	5183	4680	5989	4721	2654	5594	3219	4645	2976	3084	3480	4964	313	3390	2448	2132	286	3420	1805	1560	4701	3738	3315	5378	524	1093	704	4179	3624	4793	2137	2556	2379	5751	3620	1453	5656	2011	3045	5985	3478	1719	4715
Row 34	5099	1345	14	3791	2551	2803	4784	2907	4013	5121	2889	4208	2022	1320	519	942	2842	979	1191	237	4836	5344	3359	3364	2272	195	3228	2931	5455	4210	4911	4290	1573	336	33	2193	3938	2291	4088	5988	1076	5526	577	4317	5163	4004	291	3805	4753
Row 35	819	463	3435	5545	4060	5539	3216	5310	1688	5222	2996	761	216	4045	2379	4290	3980	2357	2730	2438	1933	1777	5426	3890	3429	351	2479	988	1463	2349	2002	3266	1553	2686	3768	4563	856	1834	5785	2618	4378	3261	5139	1593	2664	2063	3350	392	3765
Row 36	5068	410	2912	1222	2006	5623	1524	72	4802	5196	2968	2555	4772	2803	1038	2930	4718	3704	2026	1219	4166	5414	4150	4257	3510	4006	5637	2235	2627	3879	2648	2260	2156	414	5882	894	264	4070	1454	5253	696	2101	5647	805	2115	3852	750	4701	2948
Row 37	5657	1232	2578	5816	5705	3950	290	4800	4839	2594	2179	2615	3802	5354	138	3706	2588	1918	4051	1690	4071	907	2218	4292	3752	1294	2502	1294	2830	5494	3513	1420	3951	4802	2806	5391	5122	2108	2909	350	5854	1648	3629	1694	570	4118	4366	824	4530
Row 38	4301	3813	1043	3217	3252	302	2769	2089	3029	1862	2665	3108	5070	3057	1605	2591	947	4602	373	2573	846	5367	1463	3850	2779	5366	2183	2519	795	1597	5744	4409	5061	380	631	202	329	377	3480	3487	5253	1879	5419	1244	5348	3214	2875	1096	2223
Row 39	1495	5302	1070	5698	3308	560	4902	1725	4685	849	4191	1523	483	5174	935	5668	1771	3018	3267	1133	1576	4104	3994	82	2295	704	1104	3224	1691	2365	4347	5181	3426	5087	1470	5995	1852	1067	218	4396	4308	4974	3822	3625	1314	2633	3861	4335	5106
Row 40	1523	1033	5188	5848	2899	5561	4367	5783	5462	2370	1760	4891	5361	1894	1026	4305	810	742	4047	3230	5349	2736	5161	167	2073	1058	1634	5613	5290	726	1941	190	2338	1166	1399	2720	2489	2920	2998	1658	5777	3782	1302	1113	4277	1309	1852	670	5324
Row 41	1725	2132	1443	2579	2224	5168	4241	275	4689	2783	1845	3609	1325	1055	4404	3069	4454	4070	3989	3080	1391	5596	2046	2322	3413	1672	3933	5270	1443	3151	5410	5759	4047	5428	1000	5372	5735	5894	2960	1760	975	5934	3193	4202	654	3482	4284	5928	3278
Row 42	428	3377	5725	3348	2978	4998	2110	3435	1081	571	5095	401	5192	5436	349	2343	3347	2537	1237	5912	3982	1994	5975	371	2983	1359	1078	3030	3538	1383	4241	1204	5203	5465	452	2185	297	1875	3412	1877	3096	146	3432	105	2979	2367	3349	1662	3517
Row 43	2805	4543	163	5350	5700	4150	2595	4721	297	4207	3124	2244	2416	5491	1035	3048	4416	1126	3337	3787	2378	520	1016	2338	4903	378	653	617	1629	4871	1491	586	1819	3429	5311	1648	4493	4458	4341	759	3723	2221	82	3038	2136	5558	4082	2948	1771
Row 44	4840	1284	1700	4707	20	1715	4252	4860	5475	2211	2732	3010	5380	2758	5089	4473	1247	1965	5749	2099	4350	4519	4808	3258	2136	2124	3548	3006	4961	1944	1015	1057	5707	4387	2230	4035	4736	2651	1680	2604	5637	5150	2203	2147	1911	4328	4850	1273	830
Row 45	281	5704	1950	4237	1268	413	1280	5817	5044	5749	4531	509	5108	1805	5959	2211	2389	1115	3967	3912	2982	736	4165	2574	2067	4009	3897	578	935	1557	5194	74	5599	5996	1835	4271	5732	3628	3232	956	5481	2081	3298	1723	1390	4318	4557	2354	4156
Row 46	5084	1568	4546	5046	5503	4409	5175	685	449	475	2851	2496	4289	3410	4401	2872	3554	3486	825	5402	4005	1326	3148	4249	2127	4693	3820	3886	573	347	4370	341	4194	3316	1206	3761	5567	3782	4274	655	4872	5920	1883	704	5629	2691	1647	1347	5432
Row 47	4914	671	3068	1947	1691	3478	328	5735	4492	4715	4299	4297	2342	2069	1406	229	1660	2499	3352	5973	2551	123	1685	3416	1085	1448	965	5154	5986	1465	5359	109	1010	4856	4518	5417	2012	3567	2252	5349	5558	2482	4455	4727	2672	2175	300	3624	217
Row 48	5398	3143	4286	5628	5400	3236	318	4982	5292	1579	2520	5428	5642	1885	1316	4553	2185	4365	3887	4836	4550	890	2366	511	2084	1410	155	4459	4717	1775	1767	1175	3080	607	3950	786	84	1292	1578	5109	1359	1612	5007	4696	1362	2677	4040	1832	3452
Row 49	1959	4413	3456	155	4514	5886	1160	3159	4939	4488	1597	2868	2600	4123	3823	4485	979	2689	4730	3083	2167	5758	1526	4622	2750	2766	1956	124	5975	2123	5795	3910	3182	4267	3438	1746	3577	1042	3692	2880	976	3833	3995	4793	2442	4871	2091	5770	1589

I wrote this script after searching for this functionality, and not finding many existing scripts that could fix both row and column headers, giving the feel of Excel's freeze panes. The scripts I could find were usually part of a bloated grid widget, and typically required definition of the table in JSON or XML, rather than working off of existing HTML markup.

This script works with an existing HTML table. It script assumes your table has one thead with one header tr, and one tbody with multiple tr's.

Useage:

var ts = new tablescroller(tableid,lockonload);

tableid is the ID of your table; lockonload is true/false of whether you want the table to autolock the headers on page load.

Public functions: ts.lock() Locks the headers ts.unlock() Unlocks the headers ts.toggle() Toggles locked/unlocked. Returns corresponding 1 or 0.

Download. This code is released under LGPL

This script has a lot of limitations, and I have to plans to expand it.

See here for another approach using three synced tables.