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	2865	3543	5012	4156	2120	1412	4897	1643	1771	4244	2391	2101	4940	4482	4844	4065	4824	1993	5179	3630	5946	3142	1328	2500	1608	3840	1114	5839	3205	1609	3153	5117	902	2973	5564	5174	1386	5660	4740	3012	2744	1950	3207	1414	2874	3154	3894	5954	5490
Row 1	3999	2264	5830	1847	3740	5825	4163	1255	5466	4974	2458	5867	2320	4744	1169	5548	4792	2550	229	2250	5161	2273	3571	4162	4177	2731	5204	402	3514	1559	204	5452	3149	263	4529	2661	292	696	3503	738	402	3927	4387	5403	1897	4772	2462	2292	3117
Row 2	1366	3577	4660	5096	4094	2661	315	3177	3772	5666	1825	1759	5648	4117	989	2269	1840	1631	4230	2096	1635	1321	3203	878	5217	4609	3106	1905	5015	1434	184	2819	2438	5474	228	774	1287	325	5536	840	5844	807	2921	639	4193	765	5702	1652	3167
Row 3	174	4827	1433	1551	3808	535	1259	5794	5148	2534	5812	1610	4465	3188	4177	2842	1278	1961	1219	623	383	950	5434	1637	3397	4409	5852	504	3229	3404	2657	5081	764	166	2320	5382	2741	5183	4457	5720	3126	522	5707	5486	963	1247	4763	5379	3
Row 4	5267	3443	3215	2723	2187	222	264	4063	1425	1934	2920	5311	5367	1040	4358	5590	3931	2132	5318	1718	3409	3982	3286	3675	2565	4231	4786	552	4899	3500	3772	4430	5838	3373	3873	5202	483	3935	4295	2429	2653	3239	4798	3138	1191	4177	2155	1498	2732
Row 5	2275	971	5791	1141	3362	4036	4658	4416	869	1496	3208	5957	553	2793	2972	5038	5129	2603	1407	4830	4942	3100	3576	5434	2933	5283	4051	4447	3226	4511	1081	5268	924	793	4689	982	4832	5962	4537	3561	5142	959	1	1300	5507	360	5075	4587	5642
Row 6	5169	3066	965	4091	1645	3583	446	1133	4922	3953	3163	503	2683	4761	4792	3223	71	2025	3143	96	2983	3216	4569	1452	3466	1222	5517	2448	388	3662	5548	2850	4250	2056	1042	3839	3280	639	5690	4258	2885	5799	3570	2403	316	4092	4867	3448	5929
Row 7	3352	710	3353	2008	3593	3300	24	733	1129	1147	1388	2831	4285	2580	5165	4009	1047	3293	3119	4019	5406	1746	2930	1772	4191	3130	3249	549	983	3228	702	2203	5328	3732	5795	4754	5750	2484	2462	3855	3834	3958	476	2496	913	356	2090	2785	3217
Row 8	4643	5580	4329	1998	1548	5312	3794	123	4882	1306	5123	779	4870	484	4570	5575	5071	5255	2366	766	5559	5063	4868	43	776	3731	3293	1836	3515	553	1287	5151	4187	370	2594	2579	4189	1976	5698	4692	484	536	4580	2951	2615	2372	4178	2623	5466
Row 9	4143	529	914	1103	5081	4775	813	1504	3999	3324	18	4482	3501	1921	3236	5625	4082	3549	5361	2642	1135	1784	232	3478	3849	4450	5038	663	4921	4728	1	2155	2461	345	5403	4834	1870	4227	3519	3564	1371	3502	20	3142	5257	5106	2501	5823	2287
Row 10	3670	4037	5417	4917	290	2356	5586	4698	3177	1131	4883	309	3201	4185	1942	94	5613	4617	4585	269	1064	1590	2928	1737	1750	4963	3125	1280	2389	2477	186	5807	1690	5229	1537	4512	325	1523	5425	2919	2310	30	1591	779	468	715	531	2035	4796
Row 11	1712	4764	2024	5829	5880	652	945	4941	2005	2316	3999	3916	1321	443	1176	4187	459	4547	4929	5866	2942	2269	2134	4789	5310	280	5694	131	2556	4062	997	5115	4287	5795	1209	5602	308	4701	822	5468	5161	4416	2136	453	1065	3958	4929	987	2167
Row 12	143	4261	4833	3689	1272	1335	2270	4511	758	5940	4636	1040	3486	5716	2188	3658	94	291	1056	2787	89	2818	3782	3049	2666	5155	4227	3763	5060	3893	4280	5633	5972	5822	3669	4989	450	5559	5073	1893	4769	2975	2380	2094	3995	2330	1705	20	5652
Row 13	1536	311	5927	2419	1577	294	2345	2299	2006	715	425	2074	2993	1170	460	4160	4741	1869	5916	1448	2401	999	2919	2227	1214	3559	4058	5254	1026	5434	2314	4655	3992	3619	3572	830	641	4259	410	2922	306	4440	3798	228	2062	947	1168	5353	1542
Row 14	328	3688	859	2582	4341	4349	1904	1137	3119	5405	762	1926	5839	3213	508	891	3246	3049	4652	4075	1047	222	4246	1995	240	2014	2584	5302	3391	1441	504	4033	4860	1715	4910	4818	5639	5388	4448	4307	4214	3828	454	381	4085	899	1419	4909	1527
Row 15	1343	4673	3055	2388	5877	5689	1112	5961	922	301	800	1842	132	5597	1583	3070	3174	2958	2960	2662	1714	3420	4709	3216	4584	2278	1264	3558	5267	3862	3515	1745	1884	4829	1281	3316	170	5596	2169	711	3792	5263	3076	305	5242	2088	4673	3017	1579
Row 16	333	1542	766	3712	356	5063	1171	3533	2875	5199	3542	5372	2961	4310	2315	846	1365	4989	2649	5445	2276	4433	4365	2493	575	3786	4330	5711	5187	962	1539	3815	1186	3073	5177	5914	2560	4112	2847	5070	2674	135	568	3988	2008	3869	1284	5603	854
Row 17	4335	1677	3547	4735	5190	3732	2140	1501	3345	5554	2039	3563	564	2647	235	2946	461	2278	3213	3993	278	4204	1691	1547	3625	5566	4358	5283	4695	2208	3164	3386	915	3894	67	469	4148	1630	5866	4183	3095	1945	5753	1077	3384	2006	4674	3027	3927
Row 18	783	338	266	2670	1438	2727	5212	2970	2056	2007	709	3028	2572	4609	1027	3987	142	4923	3584	3800	3169	22	4059	5887	2960	569	1470	4947	3553	3072	2481	1964	2883	3808	1065	5589	3354	2527	4099	1324	980	3873	2328	4542	5941	3964	3927	1899	4113
Row 19	4111	5187	5368	5453	5909	1710	5172	985	3262	3904	5547	2101	788	3738	723	4556	1861	4779	5681	3525	1729	4624	5370	5864	3439	2206	2279	5728	3606	181	4563	3475	707	3650	5254	5133	3388	975	5732	2352	4407	1096	3883	3778	3125	447	1718	4431	1188
Row 20	3787	5118	3988	352	3469	5557	4004	5508	4750	525	2825	1473	141	3068	1037	1954	5422	1155	4574	4736	4039	2739	2878	1404	5638	3566	3258	3085	2233	2822	1027	3512	1574	3350	1608	283	2021	2945	3950	2040	4823	4159	3323	2002	4626	3531	5303	2806	277
Row 21	5655	3730	2875	1421	2803	4065	5858	356	37	1627	1666	5880	4548	2241	3052	3929	3807	5967	4512	3104	5400	3718	985	5945	3247	3273	2707	5786	3364	97	4101	4423	3616	970	5343	616	4459	729	3832	2983	5429	5654	4812	4264	4451	387	5822	815	4129
Row 22	1913	5823	3004	2353	2727	294	1966	5460	1424	3664	2422	5356	687	5452	3412	1423	864	4368	3899	4213	2002	5644	1624	4941	1312	4859	2270	5061	4033	1401	4105	1941	576	2194	3501	3684	2516	466	123	1495	459	2745	4861	2635	2763	5560	5552	3813	2226
Row 23	2176	1586	2791	2567	5531	4401	1568	5324	4429	3916	1794	4771	798	3745	4955	1015	5860	4326	4260	3078	5230	4106	5377	1318	3765	4242	4147	811	2466	1439	808	3605	5577	4398	4769	3326	5038	3107	5272	722	1294	2775	2214	408	4213	1962	2253	3954	3141
Row 24	2086	1258	2568	3970	4233	738	3690	2137	4014	3457	2117	3010	3486	4367	97	3752	275	4832	1670	2623	216	4235	3334	193	2876	1127	3351	3201	3964	92	2100	1947	4114	4612	2343	1686	2187	4275	4328	729	910	5597	982	4584	2548	7	3330	2811	4775
Row 25	1751	588	1372	3770	1930	2139	1160	2047	2740	984	4938	3214	2677	4587	3994	1275	5717	5992	2925	1939	4797	69	5816	3783	2853	5177	4393	4075	1985	939	4862	438	1800	3149	385	1532	2176	562	5112	1272	4595	4618	3151	5566	1381	2439	2355	3808	1016
Row 26	2529	4081	5020	2719	1511	4656	3914	2392	5213	5852	721	2708	1661	4487	5842	888	2105	2469	2741	2613	4067	5770	1064	5853	2674	5049	1014	1441	2330	455	523	5524	2509	4540	5293	3014	2365	2462	1499	4900	2403	1673	2520	632	5275	5003	622	429	5744
Row 27	1453	648	1948	2403	5679	94	2183	4255	3329	3825	1923	2181	4240	3954	2339	1904	4751	1267	4762	1146	1817	2027	3709	4623	218	4941	4991	4129	4499	1363	1705	5421	1212	2996	5437	2178	4550	995	3672	4720	3363	3229	2669	5691	135	3866	1814	1950	1465
Row 28	1947	611	4188	5878	4877	1872	4797	4848	1437	4133	3310	5347	3420	5449	170	2136	205	2126	3140	1044	4486	1266	3108	2608	2954	3515	5588	3894	4457	690	5926	2608	691	1997	2686	1294	4485	3752	5034	2017	5004	3186	922	827	4053	1522	4393	5269	5443
Row 29	3842	3733	5579	3371	602	5485	212	4106	2508	1348	2612	3982	2961	496	5262	5325	92	931	2139	2399	955	2317	5132	2092	3868	5839	2023	3936	302	937	5819	5442	5557	4630	5441	5969	3469	5484	3578	3058	5244	3962	712	5179	3304	1504	1550	1294	1681
Row 30	4463	2467	3626	1944	5935	3304	5898	1676	2801	3259	589	522	3034	292	4979	2323	5904	1847	1464	2951	5578	2105	3410	5273	1279	3011	922	2601	941	2191	8	2473	626	5540	788	5064	1780	2364	5626	4334	405	3456	4699	5833	1873	963	204	362	1318
Row 31	696	3536	3745	2508	695	4030	4395	8	2385	2060	1606	3682	1324	4272	4619	4720	5276	2418	2111	1964	3313	2722	2368	5712	4412	531	4426	4433	3318	296	3697	3136	5392	725	3071	88	3553	2909	4907	4645	5723	1632	4146	3050	1849	5485	2427	3236	450
Row 32	1645	2896	593	304	5841	5760	3869	4619	4026	730	263	4324	4676	3552	3129	4271	616	5383	3270	457	261	2740	4686	3049	2504	4913	1661	3050	3577	1349	4168	1440	4884	2456	1810	787	1329	2722	2932	1560	942	5474	5513	5973	4067	1690	4427	5831	4481
Row 33	4912	5646	5682	5143	5086	2336	5079	1050	3203	675	5748	3095	5560	1260	5866	360	300	722	1763	5795	4032	5136	497	133	4168	5339	1512	557	3962	2337	3139	3730	1953	3816	4475	1931	5453	5646	4531	5166	2909	2609	189	1440	740	188	1297	353	2142
Row 34	972	1730	4666	4774	3477	4804	756	3290	106	1258	3804	3768	720	1802	2726	1632	928	3232	275	210	390	4582	1620	2814	2689	2199	4699	3212	498	277	670	4511	136	2566	607	2192	981	1215	1488	1087	1761	88	3211	1134	1591	2383	2560	1814	2071
Row 35	3681	94	1764	2956	4332	5291	3526	5597	1581	635	2491	718	3492	1964	5691	5806	1867	829	2898	698	5881	1998	4638	3004	5157	2948	1221	2432	5754	4411	4061	3911	630	5679	5010	3571	5413	909	2911	2737	1342	4908	1933	53	5262	2194	3794	1896	5882
Row 36	2872	4703	2340	1479	2398	4430	3444	3190	2162	911	5779	4235	780	169	268	4661	606	1028	5259	2200	5093	2024	4228	5227	157	5264	2618	5390	5795	5026	1828	782	4086	3508	2751	5127	5962	1013	2679	4208	1726	1502	4826	5355	1795	1468	5454	1410	3642
Row 37	5689	5225	5455	5850	961	752	4180	3615	3081	1964	2902	428	2696	706	4582	5260	1111	358	5211	1613	5112	4594	5367	4882	726	2393	5113	2591	2479	4241	2506	3237	4666	383	4432	4755	4948	3768	1255	1687	3231	5297	5583	2892	132	5064	436	2197	816
Row 38	4554	857	4108	5805	3127	5285	2138	3146	2970	3613	435	3386	5510	2443	3472	3480	1451	924	2502	2077	3538	5725	5095	1722	5514	735	1385	5247	5754	5808	2859	3139	650	3225	5192	3731	5926	2570	5732	603	2449	4183	5302	5964	3224	1604	3835	2140	60
Row 39	3598	3474	4960	2739	4625	1554	5716	5954	1696	5646	5377	1113	676	1042	2537	4170	3115	2959	3210	3201	616	162	2338	308	3555	2274	5821	4108	1412	2296	4671	2297	5830	5667	246	2324	4424	4928	4441	4949	2303	2457	727	3729	4661	4303	1004	1268	5581
Row 40	983	2818	5448	890	4098	812	4576	2728	2298	5376	4580	2932	582	5016	4639	4653	5254	1319	1054	2184	3844	3551	1867	3785	3303	2703	2965	2366	1137	346	3570	4700	644	1429	5134	1253	2973	2908	814	4865	3771	3113	1668	4722	2722	3966	4899	4264	5204
Row 41	2611	2691	5744	3398	4903	5145	5684	757	3415	3112	4296	3373	4197	5558	277	5745	3194	4268	1092	5081	511	986	602	4621	3794	628	1489	4463	3095	2241	5267	640	2784	2212	1529	2289	2319	1892	2989	4079	5797	708	1837	559	2080	4622	990	2166	2251
Row 42	434	106	5798	1874	1829	5708	3375	2986	5533	5568	3584	994	2540	4864	1897	3958	3893	4865	5299	989	1318	4462	2880	997	1490	4383	2471	1817	2107	2510	4231	1464	5756	3597	1530	3266	4524	107	882	627	1230	1568	551	5745	4849	1655	4556	4302	5969
Row 43	2994	3687	1275	5808	5463	1450	1283	982	883	1995	4020	1711	5661	1710	178	5527	3241	2155	5963	2402	58	1640	3169	5301	2535	3403	3765	1065	264	3649	2899	5994	2701	5540	3533	2137	634	5514	2833	1780	986	4615	3437	695	3261	5429	5682	4675	3626
Row 44	962	2173	975	4222	1417	3587	2	484	178	5022	5873	1761	1679	2130	4424	595	2816	2921	5639	2880	1570	3659	967	544	3788	5766	5066	5607	2293	3741	2875	732	2709	4813	5699	2234	2014	3705	5137	2768	515	1405	313	969	3360	1192	3795	466	3879
Row 45	2503	3584	4351	2511	2829	5107	5003	3293	682	3663	4890	4451	3666	4485	831	2624	1965	5629	4666	3009	214	393	3013	277	4464	2342	5990	2392	3005	2809	1005	5721	1633	4369	2634	4261	4902	1488	852	2920	4253	5359	4219	2815	2470	4009	2613	4573	1813
Row 46	765	5724	589	3162	965	1170	5137	1366	4681	4037	4509	1549	4948	3841	1178	3757	154	4820	1766	959	4028	4769	1410	3843	461	1604	893	4837	162	5048	5882	283	1111	4821	3670	4138	497	3113	5293	2925	5992	2270	2175	5285	3476	1840	2044	1260	5684
Row 47	915	1780	3237	4279	1832	5558	3419	655	3376	4050	3458	4885	424	2892	4997	361	5315	2987	4876	3508	5767	4864	2666	3519	3686	4834	86	2434	4177	1349	3774	330	4758	2865	407	1922	4052	5321	1369	3182	4737	3135	4054	2203	2730	3531	2502	4230	4223
Row 48	5122	892	960	3099	3665	487	3229	1389	2762	1020	4207	4702	3864	4766	4783	4720	3393	616	922	265	1705	4204	2107	5510	4621	4943	5476	2220	5521	5304	4627	5738	5320	4270	5700	1417	4691	5614	3522	5582	5104	1231	3612	872	1250	2062	3629	5313	1435
Row 49	4615	1882	5962	363	5861	5400	3476	2882	1354	4434	2142	1332	3108	1137	2212	4481	124	1214	4671	2416	5574	931	2636	1316	4239	3443	1452	3716	2506	661	5745	4465	2822	1781	2749	3817	3757	1037	4403	5226	5218	4000	3503	2414	477	4613	3578	1106	1455

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.