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	4812	4877	3602	75	3139	2970	2471	1095	1070	120	1251	4950	5067	332	3576	2150	1407	1332	1608	3690	2339	2727	5168	2860	2271	5382	4410	5866	4110	1989	2495	4323	2190	1215	4024	5093	2263	5876	4101	5709	682	3351	3169	5655	4557	5293	2111	3287	1175
Row 1	249	2942	1404	2045	421	2318	3430	5380	1246	3076	3802	3565	908	3245	4649	505	4376	5103	5298	1057	5535	3099	2404	3727	3871	5809	5830	64	5719	1350	2243	4203	4196	3836	2798	2045	2995	477	579	5075	5850	5788	3521	3133	4484	3826	4453	1723	5643
Row 2	2962	1257	1344	2215	780	2361	795	2363	4805	5660	1663	5012	4603	4072	5719	5886	3407	5282	2357	1313	5261	2538	2796	1966	1768	4814	4737	790	3452	3722	2090	5155	144	4342	2776	788	2440	3712	3564	5758	3278	4791	4299	5992	1090	1097	1606	5942	664
Row 3	4147	1447	1423	5629	4055	5667	5668	4943	2954	2669	2204	3098	5709	5378	3594	5216	4965	1330	3446	667	3563	264	4542	2379	4756	1133	5878	1856	2824	4312	809	3022	2781	3614	3626	1677	3412	4841	3998	1244	631	2959	735	1404	5657	2502	667	543	4444
Row 4	1825	1046	5506	2720	4532	4338	3164	4871	4904	4406	5785	1627	3718	4554	4305	3485	5488	4417	1061	4989	2988	1504	4451	434	3158	1719	418	3383	1312	2372	131	1505	5332	4926	3011	4585	5602	5782	3910	5637	3043	1838	3958	5400	3453	5896	5845	4365	3711
Row 5	1709	571	4011	1154	759	3012	2312	5939	793	4284	3282	5820	1985	2134	1371	2206	3056	2407	5638	3460	3208	487	818	3280	2370	1534	701	1761	430	771	3027	3400	3146	3005	4689	4205	2693	3363	3620	3108	1974	4761	895	834	2451	3779	649	5744	1760
Row 6	404	4217	5187	705	2727	3599	866	5039	4408	1787	2518	5377	3765	3461	542	1299	5966	5574	3208	435	4078	5474	1541	4626	2203	1810	5860	5018	4312	1972	2698	1355	1763	983	766	2286	5755	1103	71	1339	2460	281	5013	3260	3644	4378	5648	5303	1597
Row 7	5209	2217	3854	4764	3449	5516	1172	4864	1389	2926	4328	328	5755	330	3977	1087	3092	1270	1505	2751	4110	4120	5927	4767	515	3188	3885	4586	3878	1082	2569	1702	5364	4518	719	2917	2571	1136	5617	234	2144	3606	3898	2221	1008	3078	5368	1074	1663
Row 8	3957	2016	3222	605	5989	3105	5107	4342	578	182	3247	860	793	3775	4013	3824	2520	3851	5962	2055	353	2184	4069	3369	2560	4500	225	2476	3171	109	1129	5032	5586	2252	295	3663	2017	2197	2306	1571	4655	5036	356	5044	1446	2083	5277	2166	370
Row 9	5319	1143	4814	951	3538	1748	826	4956	1075	4688	2622	1711	4366	2953	3067	359	3462	1146	3377	4700	5896	29	5624	1859	5036	918	5251	231	2608	3027	1871	4601	1294	3700	4534	4524	3801	4313	3881	2777	1479	5422	2486	1523	1229	5651	2152	1183	5770
Row 10	4700	3591	1492	1811	2434	3083	1925	3382	961	4809	3107	2631	3565	5076	4160	3510	563	1919	481	564	2357	3508	530	1680	3896	1223	4691	4005	3565	5694	2923	2930	4990	580	3686	3809	4015	3802	1168	2643	295	921	1740	2477	2770	3768	1849	3540	5785
Row 11	1729	5099	2655	3151	3532	3163	5009	2744	2554	2441	1368	4657	3128	4881	498	5759	3190	1656	1439	2886	2083	1179	630	5208	1373	1530	2933	1690	5314	786	4961	4785	3672	3610	1527	3930	3950	232	3116	2716	3917	2811	5472	1838	2840	5519	847	1050	2427
Row 12	5697	4443	5259	5261	814	3305	2843	3203	5948	2412	22	1411	3166	5991	4981	3769	2623	1215	4711	3181	3621	4666	1749	3409	2540	99	1224	968	5950	1548	3390	2286	5835	5877	4965	1826	5852	5896	2528	4174	5396	2911	3542	568	5630	3771	742	2981	4881
Row 13	3470	138	933	3468	5576	3573	3089	5221	2405	1157	2334	4976	1915	1679	1491	4765	3982	742	3049	3186	3742	956	2963	1540	3290	997	2237	2741	4668	1557	646	1245	1835	4625	1086	2508	3629	5270	2233	5135	2740	3485	3346	1693	3066	2524	5387	3899	5149
Row 14	4678	3498	4093	2047	3948	3305	2710	1808	2392	5102	3875	175	3273	4802	5442	707	668	4997	1801	4234	4426	3209	3557	1612	2980	1733	3303	5801	4688	1564	2943	1864	1115	710	5439	4769	4990	2454	804	1012	3274	881	2302	5752	2277	5476	4184	646	5834
Row 15	5025	3817	2872	482	1817	4470	959	311	2432	5241	1178	585	4606	4617	2618	2003	3980	3825	5820	1498	1051	1987	4701	1451	1399	122	2407	320	2334	2999	5610	2040	5113	5606	3969	4248	1612	412	4391	3581	454	1820	5330	1369	5827	70	2160	5509	2239
Row 16	3119	5011	318	5921	2552	3251	2442	4816	4516	2693	3260	5024	4989	5347	1906	2252	5748	2795	3046	2110	3509	5853	2803	1062	3254	2176	3296	2559	538	2016	746	3167	5983	3357	891	1037	1839	3694	5606	3106	5990	5669	2650	2951	2009	2955	5717	4670	139
Row 17	2074	1642	1649	1877	2240	908	1152	5884	4124	3813	3341	4185	1566	5389	4376	4295	1807	3842	5863	3648	1774	4910	3898	4626	233	1814	4682	2498	3996	2161	5017	3102	4383	4922	1570	2898	102	2788	2746	3658	1709	5092	5961	5874	3683	5193	3770	3048	4276
Row 18	3887	2632	5648	5205	3504	4284	5813	4428	1126	1429	5827	1164	3034	1073	2834	4960	2067	4811	3139	5401	1086	3918	2306	290	5188	483	43	532	900	4719	4318	1614	5290	3210	4876	4963	2206	705	1777	3334	3396	3592	4849	978	1212	363	356	3613	4073
Row 19	4756	124	3964	5818	2965	1616	4684	4120	4254	5863	3217	2811	746	4009	5191	4837	2394	2204	5981	3804	1186	2180	528	1237	1425	5445	4245	1914	1742	5447	830	5727	1871	3051	2088	4094	3911	3971	3741	3909	1242	2553	2070	2458	5632	786	690	3277	1547
Row 20	5853	4729	3782	606	387	1489	4868	498	5525	3687	1044	1108	5260	1021	5904	1592	5359	4024	702	3854	1096	2552	4252	1547	938	3329	5357	904	3083	72	4387	1219	4703	3574	2026	876	622	4220	901	2639	708	2953	3896	9	5493	4050	3188	4062	4449
Row 21	4583	3835	5937	2306	1952	4699	1827	4845	4030	5896	4588	937	1212	2603	82	5992	670	990	1713	4018	170	5917	1314	1342	4376	5603	1403	1520	2751	3257	5270	2466	109	845	3177	2523	2795	941	3295	5044	1314	5741	3347	4473	2725	5275	4524	2367	5090
Row 22	1349	2244	164	3605	2767	1957	5196	1495	5121	3901	4580	2051	1727	1235	303	27	5897	746	3682	4449	3405	245	4740	1647	2700	2806	2317	5158	227	1386	4520	1914	4745	3366	1743	4415	5836	2183	556	2185	1803	944	96	3718	2898	4812	4354	1658	4851
Row 23	4369	4628	4666	5301	1424	2961	1610	3526	4514	5781	1797	2778	149	4364	5629	4862	50	4732	703	1302	3487	382	4148	5454	3258	4805	5417	3869	4165	4874	628	4537	1665	5878	3381	5326	2631	1979	4209	1547	4966	2344	2080	4079	2112	2416	2788	1756	5175
Row 24	3857	902	3336	4551	5625	1443	5503	3871	5891	2907	3245	2539	4551	4798	5985	386	2834	3749	301	4584	1228	2388	2187	1094	3700	494	1668	3172	5812	3920	5590	5235	1700	3850	757	3559	3491	1498	3662	1044	2955	3098	381	4384	1571	568	4959	751	653
Row 25	1368	1756	4938	5686	1329	1414	994	1104	5079	4985	5346	1994	1580	579	449	1097	5847	5278	2634	482	3329	710	2932	3407	5617	2594	1687	2101	2804	4515	4593	5934	1210	3527	785	4988	2950	3542	1460	693	2490	3104	2413	2817	95	4780	1688	2436	5089
Row 26	1945	5970	4760	1521	2253	3020	2709	5004	3162	1818	2848	5675	1000	4821	3833	553	2851	2525	5514	3959	4368	2185	387	4928	3874	5288	4320	3798	1857	608	5756	689	2564	5258	3318	1757	4907	3827	1613	1276	3574	3245	4943	2106	1529	5113	644	5278	981
Row 27	218	526	561	4151	2442	5962	4715	4323	3102	1572	914	2056	5704	1888	2833	5549	2486	3225	200	70	4076	76	4290	3431	3293	4370	5431	2579	2193	2672	5843	3672	5049	3238	1958	1281	832	3893	5226	5558	3631	3893	5649	5978	2239	4291	1694	2669	4197
Row 28	361	1525	5194	388	5912	2619	4774	3356	5907	2978	2863	3551	5916	4795	4985	1547	1208	4932	2545	1597	348	4073	3721	1141	3722	4831	3157	5743	3570	606	4806	4215	3950	2947	5099	5471	1237	3770	1435	5835	2323	4409	1705	2535	5124	4225	3459	2060	4161
Row 29	4923	4453	2698	1165	3749	5869	5309	4209	3965	3930	2720	2392	4494	5965	3081	3980	4238	4986	5380	1276	5023	4385	4895	22	751	4281	4122	3005	3853	1548	1199	3731	2783	1152	292	5576	5345	3081	478	4602	4857	2718	658	1296	2950	5095	1128	1606	3199
Row 30	63	702	517	4335	1188	2396	2488	5268	4352	2522	5461	3042	719	2681	289	247	5432	2622	2380	2497	2645	3217	2596	5472	2357	1096	1769	974	1342	3615	3020	5970	5862	4646	5328	2448	4163	3953	3697	2506	11	3309	552	2359	4960	1752	3847	939	3072
Row 31	3194	2298	2635	1191	1239	4061	5205	1158	3866	3678	5974	5560	5398	3545	153	1182	5247	5262	5625	2058	1928	2176	4461	4935	5843	5009	2014	5734	2842	1132	338	4029	322	4677	2714	5194	1157	430	3198	54	2007	4558	4902	2190	4637	3399	3274	6000	5431
Row 32	2852	2193	1797	2074	3523	2610	708	590	4309	2666	804	3246	4278	700	4195	4702	4495	1583	4961	3119	4526	4895	2756	4839	3715	2177	3528	1328	4368	995	4004	2209	5552	1707	2503	2654	128	4657	3477	5299	1645	3748	1721	2284	351	19	5076	3242	3457
Row 33	5706	2247	563	3853	2123	1152	197	5826	5316	1801	3442	5264	3470	4937	2811	5040	3730	4342	1495	3315	1263	1665	3201	4796	5387	2792	3013	4606	5979	5389	5418	4562	267	718	5217	3171	4788	3919	5745	3643	1762	5192	3932	4161	3904	2327	2460	2551	686
Row 34	645	3393	5040	3915	2017	1445	2568	1870	1525	3185	1502	5884	5577	5005	717	4454	3814	5030	1052	31	4315	3810	1197	2111	1604	2667	847	1524	5069	5253	2672	5311	4605	2763	4646	5543	2039	1492	2017	2970	5804	3594	1483	2059	5087	2424	5059	5326	3794
Row 35	1636	5417	2966	5339	5849	5433	1610	5197	2024	5677	633	2313	2401	5370	429	5761	813	873	2017	2971	485	3438	634	5283	266	4733	1337	2966	4216	3128	1804	487	5413	3045	2874	4590	5017	5392	639	3493	991	4587	5409	1041	1717	5794	3386	4440	3926
Row 36	924	4172	181	5638	5058	5481	3228	3509	3093	381	3065	2557	4435	4496	1765	4720	4733	2686	4463	3699	4120	1031	2437	4601	1192	431	4521	5528	2039	4067	1241	1781	2050	5277	1012	4664	141	5491	3077	3048	894	5584	2974	3447	4878	1489	480	2067	4458
Row 37	2253	422	2424	2580	589	1419	5693	633	2387	3285	408	916	1184	1807	1339	1508	521	2420	1931	5059	2447	3752	4060	1891	4560	4361	1695	3045	2403	1548	3109	1750	2457	981	462	1821	3209	2091	1395	5810	2348	417	825	5653	1675	2568	556	2825	1991
Row 38	27	5595	632	5343	904	5231	4841	119	2915	2594	4084	4425	3780	2660	903	925	4412	1293	467	5631	5745	4167	4990	218	899	3450	4065	1241	1311	909	4237	5932	3891	5604	3741	2039	4869	4056	1869	4302	5004	1875	2360	379	2791	5750	4504	604	4014
Row 39	1799	140	3716	5196	3294	3285	2214	4650	1342	1711	2647	1090	3306	5583	2804	1156	5235	717	4341	4436	2832	5196	3698	1352	1462	3169	4848	2905	5014	2891	1201	5924	5255	1933	818	167	3496	3921	2419	3333	1956	3328	3132	3630	1323	2330	184	2688	1519
Row 40	5558	773	1536	1829	412	2216	135	2338	1337	1420	1945	3664	419	786	249	5094	2250	2117	5415	5888	3642	5734	2156	2451	3128	4219	777	2147	2970	1836	3195	4749	3537	2848	4570	3366	1986	4836	1528	828	3845	5426	2469	3841	4408	4043	4224	5351	3638
Row 41	693	3555	1514	5389	5669	5936	5352	1293	5387	2383	3474	5842	3812	369	3433	151	855	2440	255	2597	1973	5454	1006	1194	4651	1066	2209	1272	1843	797	911	767	3067	4486	4391	1394	1601	5561	4289	3230	4379	1506	2206	32	3070	2077	3400	3506	1767
Row 42	2867	2738	4884	2829	5640	4154	1340	2848	2714	5618	1743	2559	4861	5011	1332	4565	1129	5545	1475	1672	4332	5357	3273	5275	475	1518	3735	4797	2553	988	4674	366	4983	5180	4552	636	2112	92	893	859	5282	3378	1859	2842	5405	1869	1481	647	766
Row 43	3523	3303	1874	1000	3410	2365	4505	4699	1191	4125	5038	2101	1784	1257	5547	4210	4580	1690	2358	3017	152	3294	5118	1482	807	5128	2124	801	2567	720	1461	4415	4295	2029	3739	1553	3679	1195	265	707	5092	1500	4100	1329	1485	5775	4976	315	3744
Row 44	1189	3762	777	5083	3981	4939	2538	3483	2883	5055	974	2065	2957	1780	84	5028	354	4963	979	481	4480	1272	4499	4502	5539	343	4847	3357	5882	222	5629	4124	1659	4340	5602	2516	1980	489	2724	2565	1092	2238	3227	4508	3606	3241	489	957	5445
Row 45	3469	4593	3195	3512	2937	6000	5626	1131	3031	5170	2583	4193	4479	3448	2163	2822	2930	5229	1632	3515	796	1849	1640	1387	2842	5983	5749	5977	1508	4892	1911	5019	3184	4266	2225	575	2548	3805	4062	27	4355	752	2634	5510	5600	2915	1693	735	5221
Row 46	3242	5517	5136	4427	4792	3691	5942	3132	5732	3597	1266	5643	332	5765	4953	3819	2656	2159	760	5854	1299	995	1812	4222	1441	2157	3855	5516	163	5487	1653	103	4057	5456	5778	1452	4211	1632	2986	168	3729	483	2693	1877	297	1448	2261	5381	3803
Row 47	2033	1161	3992	313	937	1231	3749	772	1533	2436	5301	5630	3821	3937	2501	2324	4318	994	3728	4743	5183	1618	4675	1600	5054	4191	3497	2407	3987	2743	4321	3920	5290	5292	907	99	3469	3421	958	1572	4548	1847	143	1016	1742	362	3204	2384	3393
Row 48	1043	4628	2191	1685	1176	4778	1262	2525	3937	4108	2248	4518	338	3389	2888	268	3744	1978	769	2896	4320	4401	2561	1690	2571	1773	4707	1967	2725	683	548	5098	3911	3542	3186	3473	4609	3894	5875	3584	2774	455	1896	3598	1582	3899	2616	5316	1031
Row 49	2916	4456	3974	4246	4374	1099	1510	5005	4294	77	3077	3985	3206	4843	5806	2880	1627	3129	5968	5473	2105	4541	2015	1066	3931	4575	3598	1646	1865	1247	5687	845	3513	808	666	1876	4671	4468	5980	4456	2934	2625	1266	2509	1251	804	5099	535	535

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.