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	3729	873	12	4455	1557	5490	5478	3301	413	1413	5590	4978	2022	3760	2166	2236	4538	5147	3590	1132	28	3391	2219	4763	4298	3562	4728	1965	5123	425	4371	1666	5660	3658	2224	3660	5697	2490	3662	1843	1088	4226	4747	2629	4855	4953	5524	1570	180
Row 1	5259	3865	494	528	1	5429	565	1436	5268	4632	5636	1745	3106	3253	193	3540	1796	1234	3484	912	2979	592	1071	1805	5343	301	22	5598	5630	4666	4489	2935	1222	402	3029	4942	5806	4503	5456	5261	3716	4400	1573	3978	4614	2786	2308	3188	4841
Row 2	4271	1836	5498	5710	1725	802	2457	3598	3233	3462	5793	4065	101	1613	5526	5455	3993	3388	4390	1858	5235	2380	4439	908	158	605	1979	1130	5495	3180	981	433	3480	4271	1851	4249	4577	1249	1136	2628	3465	468	4682	4532	1246	1667	1548	2880	4127
Row 3	2151	62	5540	4257	4473	1391	5776	4341	4447	1539	2377	2933	1793	1161	2761	2116	5501	5560	1666	3858	3784	2240	3813	2657	5383	5209	4694	4045	3356	600	181	5520	4740	155	3455	663	922	3919	5687	2059	89	5870	5059	2969	963	5025	5411	3122	4888
Row 4	1263	4231	5760	2554	324	3906	63	3384	3523	4993	2373	5088	2227	2587	3717	2242	3241	2045	5848	3845	4607	5011	2459	3153	2056	3166	648	2382	4337	5011	5313	1605	4370	3949	5993	4091	732	2537	4802	4077	5555	2972	4410	915	1554	89	3072	2088	3064
Row 5	3026	5261	4417	1790	3708	2953	336	2419	5122	2209	5404	5422	4564	5233	4473	4980	4528	5648	4952	3067	5796	184	1011	1973	3269	2074	5369	3271	2447	2013	3083	4104	3425	4312	4786	2382	3629	952	4106	1781	2787	2969	3179	2380	4307	1420	5928	2996	4926
Row 6	1823	2932	497	3527	4899	1706	5651	5041	1923	4939	473	995	670	2937	2028	4081	3715	418	5832	1439	5377	2560	1024	112	3803	4377	2360	3820	5904	1317	5975	3705	3808	132	248	122	1063	2567	1922	2848	2866	5124	1838	4874	4131	5812	4872	700	2684
Row 7	4136	3589	4323	3607	2876	4594	2454	1044	1616	5868	2147	3023	585	307	495	2667	2145	5312	1914	1258	1142	5342	1622	2724	2403	2474	4876	2235	1288	4449	5295	3619	3132	1986	3296	273	3419	3043	192	4091	1162	3229	3525	3637	1611	3163	3833	3710	3060
Row 8	4013	1379	5924	1610	3557	2456	2894	2830	3847	1179	905	3251	5303	1276	249	491	310	4131	4166	1995	4253	1314	2010	5814	2340	3166	816	4003	3438	4343	1077	2148	4759	630	2003	2215	5335	5784	5407	2432	1928	3549	712	158	4652	5138	1034	3016	1267
Row 9	3380	2549	2338	4316	2803	780	485	4034	2881	1836	2972	5550	3898	3666	5562	1128	2101	1311	2414	5009	3380	5798	2630	5043	4874	5534	176	1228	2113	2201	2486	4841	1695	3350	293	1693	62	2294	2934	3898	705	2252	4641	2166	1316	4015	3440	4321	764
Row 10	4918	5317	3827	2158	5023	1891	5479	2643	106	1727	2988	1399	5940	3844	487	1781	5047	2892	4479	4639	3975	1683	481	2155	1570	3955	2900	5696	712	852	2135	5790	5483	4178	2803	11	2416	4903	2944	4914	3851	2797	3958	2346	2222	3873	2922	5564	259
Row 11	3527	3817	502	3723	5820	225	172	5909	2781	4901	5686	5704	5122	3725	2774	3550	1505	2046	4012	3172	5821	2520	1080	45	5809	4662	4770	5097	5547	3176	4243	5814	421	169	1163	2928	1851	132	105	1761	5475	1871	3933	2523	2270	4572	5551	3121	1642
Row 12	4298	3176	2677	4331	4805	748	2042	5019	4159	2082	2079	649	1795	2011	5321	5697	4262	5586	3795	3494	4323	1374	125	1928	3210	2490	1656	2013	1828	4012	4170	3033	4595	3721	4064	2007	1060	1584	2554	2766	4884	5949	5546	2054	2846	5274	2045	1897	243
Row 13	2033	959	3395	4915	897	3074	1804	2652	2406	2607	1585	1871	1841	4548	4791	3068	342	1414	871	1152	4614	4275	2582	3555	4124	4776	409	915	1982	5447	4018	5594	939	1629	5949	545	3065	2268	411	4564	4252	1551	2214	4503	2635	2809	3427	580	1878
Row 14	4338	666	4183	2298	2164	4224	4065	1402	1113	4800	706	726	1502	1370	2120	5158	4882	989	4115	1259	3098	1668	2504	3392	847	147	2410	693	3076	2339	5640	2789	4764	3334	236	1286	2168	3178	1632	3851	2753	3823	829	2786	2780	4725	1192	4535	1020
Row 15	5274	438	713	2039	5812	309	1017	4668	1682	1336	3948	1981	3943	773	4561	2021	3919	5538	5070	5728	5945	3656	3853	1170	3375	2875	4844	2579	3153	129	3912	2379	792	1102	82	2237	1737	3948	1875	1241	545	5204	186	2356	3450	600	447	5549	3253
Row 16	5699	4895	3350	4668	2764	4108	4864	1511	5139	2056	1500	3119	2900	31	1238	1759	2994	4055	4324	858	1270	2090	1797	5593	3074	1022	797	2470	5330	425	4408	824	5409	2428	5963	4033	1636	5371	931	3942	3019	2270	4873	4054	4015	1664	3312	1160	1121
Row 17	904	2449	1121	790	5332	1499	5539	3791	2557	4223	2330	3306	1667	2697	3963	2115	3600	3513	3003	4890	2192	3736	5509	1002	1954	3605	3259	3756	945	3890	826	2814	734	1681	4963	576	4672	497	5770	3420	3581	1549	4369	5652	3275	3447	686	87	2685
Row 18	948	2514	2493	2221	4003	4298	537	2946	3986	3052	5510	2576	1004	3120	3822	5003	4690	1664	5693	5599	4470	323	680	808	3473	1383	5122	2445	4038	3771	950	5219	2905	489	3305	5313	5112	1062	1019	4223	2956	4035	1433	1567	2445	609	5956	3761	4500
Row 19	5507	2350	5899	4673	3869	5814	5056	1894	2014	1076	5240	4307	1426	3103	1132	4837	1416	3710	92	3131	3522	300	2005	1755	90	467	1401	5255	866	144	1783	5413	3991	3830	5740	674	5288	5154	2191	5364	1064	1293	2084	1249	3712	2281	2486	3878	5750
Row 20	4699	5746	769	1376	1643	2262	1396	3779	2926	1090	3024	1144	3092	5539	1538	1026	5163	5987	3487	4865	4706	683	4685	760	4662	3619	3146	1797	2396	3549	4955	3470	3957	1284	770	5919	2807	3790	609	372	3314	5127	3634	5144	3660	1902	63	2774	3782
Row 21	1352	5253	557	4056	3588	4437	3110	1479	2703	3150	2568	3644	1166	2987	3671	617	3144	5078	4145	2012	1653	1634	5698	1883	122	3440	135	1901	1857	1247	1549	4325	2715	780	1372	4404	1924	3121	1941	3363	5343	709	2463	2576	5152	5660	1003	3642	3314
Row 22	1022	1587	3568	2893	3732	758	3006	4564	4528	613	1817	3771	4800	2721	5310	3359	2775	5190	5574	1284	3602	4761	1611	1974	483	1451	3273	3782	3082	2434	1567	5892	3895	3905	1060	3781	2633	95	4806	4212	2031	4657	4945	108	3394	4987	3511	3884	1692
Row 23	295	2924	2229	5561	4289	4069	4357	1296	1727	2913	2670	5759	2389	1423	3544	2728	398	453	1485	936	1898	633	1679	2461	2128	2926	2449	4466	1392	3092	183	382	4970	3723	1963	4070	1083	3383	1036	1343	2537	314	2926	4520	316	1529	5302	1358	3366
Row 24	4524	117	2645	4857	5489	3158	299	2115	4064	2204	891	4828	798	2623	2554	1068	4747	2481	3678	3512	801	499	1153	2135	4042	2340	5788	2952	4153	2164	2118	4104	5952	3833	3344	5427	3088	3043	5668	3347	1467	3995	2610	3943	1214	4104	803	778	5524
Row 25	401	550	4965	4559	2740	5242	920	521	4650	2684	3970	4506	644	3343	910	1545	4341	3545	723	4718	4609	1441	5372	5214	753	5152	948	4049	49	1911	2948	5053	5658	5759	1408	2215	2216	1783	259	3685	1648	1225	4632	600	5656	2467	3024	2493	1524
Row 26	1550	5070	1188	2778	3661	565	3269	3701	414	5500	4943	4890	1803	4593	957	505	5411	3053	2152	2748	1806	4583	2900	5747	5557	216	1181	2446	90	4999	2747	5992	2492	5145	3033	47	3155	3398	533	438	4610	3210	1762	5102	3831	4471	1787	1809	4832
Row 27	3584	4787	5808	1960	3560	5032	4403	5480	1652	166	565	2479	2656	5201	278	4452	168	5916	1455	2944	3617	5060	3643	506	1344	2176	3517	737	3787	5749	117	867	4326	5423	106	2745	5732	160	4674	4263	1240	3982	54	1220	5145	3076	2362	738	3110
Row 28	5772	5334	4021	1355	523	5527	5632	5741	5635	4154	5826	2443	5634	818	3182	631	4957	5662	5082	1843	2061	5090	781	1435	1802	1525	3943	3976	2082	3911	4696	5371	5667	5166	4939	3571	5420	4270	1990	960	5809	4643	2282	4594	2213	861	3539	247	5782
Row 29	1928	2905	5208	4050	2495	5634	3523	742	5535	1487	3416	5980	3404	1409	1829	4614	4127	1696	1674	3848	4418	3107	3339	5277	431	763	5718	3345	4738	5733	5030	5882	2440	1475	3235	2915	2045	4498	1089	5524	2744	3777	2976	4051	4661	1695	1650	4148	4739
Row 30	991	445	4582	4598	5745	5624	3363	5451	3675	5414	1397	4476	4208	5343	5916	3085	473	2999	2739	3119	2561	1796	5745	2400	1357	4636	3385	5469	2500	3443	5892	3499	3609	342	521	3300	2008	1069	2142	1431	234	4865	4520	5855	1281	3887	3980	3796	3821
Row 31	1984	2088	3817	1037	737	5130	3115	535	2575	1326	707	2896	1546	2523	1013	2783	4083	594	2132	5856	5206	2521	2619	607	3967	1581	5433	5444	1653	208	717	4568	1583	4103	1185	2313	16	3500	5420	5349	3151	2254	4423	588	5656	1822	2696	3161	3865
Row 32	1697	511	1855	3371	5204	2896	2759	4228	2331	633	1122	4798	2412	4279	1448	555	3086	2238	459	3901	547	3842	3918	4342	1118	3829	3309	1029	1801	3763	5117	2856	4184	4221	652	3915	1350	2871	218	1045	3043	933	2249	934	2021	2658	1022	3781	5148
Row 33	1503	3929	162	152	2783	3172	4890	2486	3743	4024	2852	5477	577	3189	3158	2601	4823	4791	1233	728	980	3744	3893	762	698	1693	3931	340	3650	4415	2444	514	792	4809	3226	737	3981	1345	1410	697	2939	5983	1775	4231	1844	3584	5067	3169	4335
Row 34	988	5517	4067	2634	2578	700	2448	242	5745	2197	111	2027	5878	5230	4872	1530	5166	2719	4419	4627	5581	1314	4042	768	1487	5170	5227	4905	297	2213	5051	4284	5757	5292	5931	520	740	3880	1782	5336	5627	4802	4377	1162	4215	3790	5831	5568	5250
Row 35	5655	2574	3531	1689	942	241	4369	3058	1425	526	5379	3440	1797	5393	978	4826	2869	4653	667	3427	3751	4842	2031	1526	254	3040	4761	2205	4835	239	3146	5911	508	4641	3181	5845	3147	70	2346	3889	3427	4174	5843	5209	3109	3278	1944	4526	4120
Row 36	3554	1154	2646	1478	1034	4229	561	969	1268	1519	1394	2035	1393	54	1367	3182	3843	4312	2662	1269	2160	4108	1222	972	2085	2948	2606	2983	2605	5582	1850	294	1246	429	1226	3749	2432	4069	5018	1109	835	473	2824	1003	465	1873	904	4694	760
Row 37	3072	3754	1666	4155	3507	3181	640	1742	840	1549	4487	2022	159	5153	3892	4183	4260	556	5777	4062	808	3074	3396	2958	4730	5784	2410	5646	1805	2732	286	3830	2361	1883	2144	1251	2991	225	5120	1768	4774	351	1478	4405	3550	3502	1343	5573	3286
Row 38	298	5128	4373	1362	5203	408	3427	278	4300	5921	2541	2203	4556	3692	4299	1078	2096	4397	2464	3039	3704	865	762	4098	5790	4383	3045	3966	203	4383	2251	4199	4383	4299	4322	1030	167	1101	1558	5776	2168	4107	18	4905	2543	2060	1182	5654	1922
Row 39	3583	374	1644	2505	2038	196	5283	5741	4007	1853	5775	5600	1738	2795	1360	798	4645	5424	4550	222	3977	4884	1650	1735	4127	3173	5360	2297	2482	3359	4476	1753	5296	3195	410	718	2429	3481	1419	2290	5014	2305	2769	2660	495	1052	5238	1879	4615
Row 40	961	1292	1119	5668	5154	1396	63	812	5361	4645	1016	2193	2073	4672	3184	678	3021	3190	2354	5296	1407	884	1633	2385	3800	5081	4854	1453	2320	1668	1687	4744	2355	2077	729	2511	5286	3979	4389	3080	4793	4921	179	868	1086	920	4957	4845	1179
Row 41	3203	1352	1701	2336	5378	456	1716	1215	5713	743	3722	4674	879	25	3553	4596	765	2746	5775	4456	1906	2709	3281	5736	2049	2684	2180	3868	2261	3311	2604	3310	2872	3492	307	2208	482	5122	2233	2132	769	2986	1070	2204	2589	951	1939	4044	856
Row 42	3038	4399	1471	2585	5676	4212	3239	2268	2485	2897	1387	5197	5875	3625	3586	747	4355	5647	5814	22	2008	4142	5386	1052	2143	2289	464	4736	4907	480	2657	4315	937	3035	1901	3939	1540	5871	5800	5168	821	188	5839	3206	145	5042	1407	1530	2080
Row 43	3889	855	1307	3082	5770	4007	2505	1286	3430	5176	3070	738	2075	4845	730	1149	3969	5372	432	3550	5723	3428	4443	1533	3429	415	4145	2034	4238	1505	1121	319	2092	4662	3255	5644	5287	1712	4659	1284	322	1309	4672	2055	2499	4110	4418	5663	395
Row 44	3576	3049	3085	2941	3724	4463	4884	4584	2756	2959	3410	4840	927	1335	1698	5002	2428	5396	2576	3062	1761	4943	2988	2566	359	4457	4536	365	1940	5438	5053	5840	4136	1909	4086	5365	3331	3807	2222	3318	3329	5705	1638	4815	2323	1704	4028	5027	3602
Row 45	3985	701	5594	1906	3122	4269	2236	5646	5654	508	3327	4869	137	523	1414	4604	2382	4696	332	2110	3357	122	5162	4827	3498	1165	4662	2722	4126	1388	643	4761	1923	4833	1272	4888	3767	1960	2668	19	1750	5403	3893	54	3799	1386	3642	348	4595
Row 46	4104	5211	1265	1675	5422	51	4740	3337	1556	1222	2616	3484	3613	3887	5141	4480	3126	934	2923	2122	3265	1751	3771	3344	1640	5374	5505	3038	4876	143	3470	4780	5505	5944	2985	5498	2619	742	2287	4521	2999	1102	1519	4427	3034	5068	5429	2714	952
Row 47	1700	2336	1164	5766	867	166	541	238	2393	5538	4765	2177	2713	2876	1407	5862	4244	4521	1298	2574	1423	5143	997	4826	4912	5693	4640	4449	4337	2806	4477	1415	2777	3210	3469	2692	4018	2184	1203	2883	843	5786	4375	3437	4708	4146	4925	3967	3829
Row 48	1161	2818	1862	5933	5521	1590	3023	1907	2382	4508	5154	4325	3630	4606	4362	4244	2251	4326	674	1850	771	2177	828	2019	3341	5170	90	5886	958	50	2465	380	503	489	1996	3885	5317	3463	5395	788	3380	4248	5453	2613	5068	43	5613	4707	3385
Row 49	2452	5647	5147	4919	1796	5231	3890	1445	5407	3811	634	1636	1223	5768	2541	3447	801	4732	1951	2278	1028	4969	109	5594	1775	5523	625	281	5774	5029	5283	5015	1063	2831	2696	1649	5496	115	5142	4738	503	4706	4345	3145	5953	1147	2512	5963	2465

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.