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	5634	2121	2390	3539	2184	1855	5850	3194	5561	1321	298	4435	289	5943	4321	5637	634	5944	5412	1127	1341	3901	615	114	4079	894	3267	2262	1335	3998	3329	4035	5736	685	2112	4720	404	314	656	4752	3625	3284	621	540	455	4044	5106	3841	1584
Row 1	3916	4644	5968	2929	278	2785	3362	105	2865	5934	2362	2309	2663	1383	5386	4446	1620	4387	2981	1702	4257	5731	4616	3502	1565	5936	3062	4374	1320	2886	1667	560	2790	5991	5124	3503	4690	3456	547	1249	1775	898	4852	1007	5118	39	2220	5584	2442
Row 2	4472	2305	2369	5156	666	3496	2729	4196	3802	1659	453	1159	2141	1215	2801	1312	4427	4584	4448	1178	2879	1028	2140	888	3128	1496	2496	969	5532	3236	4213	2902	3555	3464	3992	3496	4794	1733	4900	5554	453	2555	2134	446	1920	5463	2487	3573	1942
Row 3	3888	1355	4773	2345	3111	2198	4879	947	5388	972	2071	3700	3134	664	4899	3497	910	3714	4572	2040	3762	5438	1523	4807	5110	485	3022	3475	640	5367	1118	4212	3792	1043	3418	4634	3139	5549	5219	1158	5391	3866	3027	5985	2710	3886	2153	109	3486
Row 4	1249	390	5411	5560	1766	2238	1417	1495	1012	4854	5063	1638	2657	1711	4071	2019	634	2724	96	4194	5635	1459	1895	1829	3342	3144	879	497	2445	1802	1951	4202	3568	158	5887	2224	1337	699	2390	460	4651	3500	3557	5810	5404	315	150	1008	4018
Row 5	3747	5250	222	4811	3004	2987	2131	1348	5673	689	1736	1693	1998	5820	2938	5096	5453	3860	1590	576	2764	1684	5708	3777	5541	1475	5363	5646	4363	5400	4147	4935	827	5093	5068	3525	694	5298	2587	4836	5693	3154	5700	4372	3339	1980	4723	2005	3543
Row 6	5265	5024	3865	2121	508	2501	692	574	4371	5466	3933	783	5187	342	5676	4391	3017	3775	5684	2799	338	1152	1914	4491	4510	2745	1128	5884	4958	5020	1613	1405	52	3022	3685	1931	1159	249	249	2633	3140	2497	1213	5928	2868	4126	3388	5398	4637
Row 7	350	1095	4482	451	2280	4093	5338	5584	4925	1527	2885	3391	1169	488	1427	268	1655	1639	3284	2025	4438	2871	4172	4559	2333	4298	451	2066	730	5428	5519	636	4635	1921	3144	4433	4755	3457	5385	1786	3481	2800	199	2484	60	2094	701	2342	1082
Row 8	1897	4107	3678	5054	2507	4704	714	593	4370	3939	4003	1466	1891	4598	1477	1905	5933	2995	519	2504	5679	5612	105	3060	4022	5374	754	1700	1588	15	3186	654	4607	2508	4717	1807	5045	2723	5134	3342	2471	4865	404	4525	2767	3484	3192	5576	1031
Row 9	5445	5862	2168	4372	900	1264	5552	2930	3714	5891	1510	125	252	1813	5783	4299	966	3906	900	845	1302	4791	3848	3187	2205	3141	3636	5123	5707	5849	1970	5529	709	5488	5491	1348	2379	5024	2493	5634	2265	2040	2776	194	133	4334	3711	4874	5701
Row 10	5204	4053	1626	3024	5517	3610	1174	3005	2091	922	4869	4891	5653	1061	3809	5203	577	4887	3408	4919	2117	3101	4535	4067	815	4996	3997	3985	186	387	600	3866	4005	2992	1078	2363	3597	3258	1513	21	4525	2112	2937	4608	5918	5762	5702	3503	5101
Row 11	534	4281	2068	3116	3838	1854	1301	5884	1920	5956	790	2795	5667	1438	5747	3881	2559	5683	1568	5598	2703	235	2944	4639	1807	1797	1805	5808	1600	5463	1999	4568	3482	5760	2721	1101	57	5243	2693	2755	4261	5619	758	5718	5413	1878	4833	4874	5724
Row 12	5879	2948	3706	4117	27	5299	3106	4740	5210	3513	3999	4860	5113	5716	5350	314	4340	4481	3437	1861	1410	4325	5098	2854	2729	3525	2177	1324	5303	2556	1889	119	4510	361	1515	1425	600	5253	3681	390	4638	4235	1257	1799	1001	3777	4198	144	4447
Row 13	2490	4142	5065	1263	975	3031	2518	4701	2985	5888	3712	5598	1451	2242	3559	350	2712	3097	1472	2867	3913	3305	759	1019	2169	3268	5876	1752	5165	2462	2688	4910	5560	4948	859	5307	543	1023	1704	2351	3171	2515	4468	2013	5207	4580	1622	2865	5577
Row 14	2170	2814	4137	3408	4647	2119	2283	4651	3737	1253	1713	433	1997	2383	5203	2471	5896	5804	5274	3785	3783	964	5550	3205	4952	4993	3667	4463	4792	2921	3988	1289	4497	82	1159	767	1045	389	5270	2566	4395	3763	435	1977	2118	4284	3142	3929	5558
Row 15	4156	3450	2677	2130	5716	5171	3731	5457	1297	5668	814	4236	2066	3035	1455	2995	3999	1036	5075	538	518	5411	3478	3535	5587	5752	3158	436	3150	4829	3924	1998	5286	1133	697	2410	4034	4407	4463	510	2950	3726	4774	971	3373	549	2661	3436	4915
Row 16	4853	4170	1590	4324	4171	4864	891	2631	3453	3864	407	5302	4279	842	907	5512	3776	5771	2188	4725	4348	4457	196	3472	1105	5072	548	382	2988	126	3332	3841	1472	1402	3734	319	3602	5106	1921	4798	3249	5072	1357	2487	2290	387	646	4041	948
Row 17	2605	1094	4027	5030	3010	4089	1060	3678	5490	2630	109	1978	4626	5763	5677	3125	574	5973	5907	4494	3666	823	1445	3125	2768	1423	94	3724	4553	1274	4844	111	3199	2428	2485	709	501	3022	2830	1535	4347	1122	2112	4482	5907	3935	2688	5589	4503
Row 18	1908	47	2972	2050	3908	3081	2538	407	1434	4687	4772	3270	514	4363	2757	152	16	407	2727	3101	1614	4999	3027	844	5282	679	3533	695	2022	1058	5669	3100	2920	3667	2497	1046	3089	2428	3850	3510	1688	1775	4163	4486	447	608	3815	3443	5516
Row 19	2193	74	2853	3418	2438	5736	941	1035	1895	2552	4927	5885	4408	1175	3952	4119	2552	3801	5805	5162	1769	1949	2480	4396	1249	2007	5915	2686	4101	3224	3738	3147	3196	3790	5773	3213	1810	3038	5005	4890	3276	2740	1197	2824	3960	1077	923	3256	2971
Row 20	3805	1105	2775	3441	558	2577	4914	4236	5836	783	2120	314	2729	2078	2688	2208	3016	5118	3237	354	4097	19	2012	503	3259	3100	5128	735	1882	2457	3733	4175	4258	2714	3556	4337	4413	165	5359	3821	4348	5245	5875	3236	2127	4646	249	3269	4602
Row 21	5040	602	4937	1801	5440	3310	334	3668	685	5139	1764	4010	2349	4678	5533	5328	1602	2607	5077	5885	5506	3724	5755	3417	3886	2486	2272	3689	3325	4098	2547	4012	2077	231	3830	4926	3639	3970	5499	987	5178	3597	4176	4222	485	5186	16	4332	2754
Row 22	5068	2856	729	790	4678	2268	2431	3985	2783	4849	5338	5540	5745	5321	4216	2529	62	1528	2670	5660	3732	977	2536	2329	3104	3460	4565	5595	4335	3264	5225	4427	4735	3937	4991	4	2929	5107	2375	2433	5140	1715	4271	777	2115	3210	3583	3664	3394
Row 23	3997	4446	1985	351	4280	5327	4905	4169	2719	3936	3384	2230	5347	5785	3873	4084	3491	4049	958	4705	2917	4469	1706	574	3868	2905	4375	3533	1081	988	2208	5349	214	2240	5185	3959	4442	2747	3977	3001	5662	1133	424	3568	1008	2424	791	2357	2230
Row 24	2063	3411	5059	1542	2489	2795	372	5440	4395	706	3524	4763	3676	2722	4202	3178	2838	5679	3090	5390	3626	1702	1482	212	4519	2453	143	1671	1144	2230	4011	1646	5940	4824	2354	3338	1917	3950	2390	5763	4286	2666	3010	5318	1215	355	2994	1664	2934
Row 25	5851	578	4478	3266	3501	5399	238	3905	155	1953	1436	1087	4775	3480	440	3060	3080	4513	2731	2940	1036	1805	239	1340	4186	3735	1792	2058	5057	218	2004	3816	4899	2117	5559	2002	4949	5003	955	1225	4094	4407	5269	1728	5349	5909	1567	4209	1621
Row 26	5615	1388	2754	5973	2610	2127	5955	1023	939	328	694	1604	3481	1385	3115	249	1891	40	851	3282	268	5547	1548	3388	680	5864	5895	614	4074	1869	240	5924	3471	499	313	2319	909	4382	3675	739	5332	5444	3403	4025	154	389	755	3229	4247
Row 27	3522	888	666	4598	873	3151	1605	5033	3071	3375	5053	778	528	5066	2707	29	2420	5299	5375	291	1710	3182	2513	736	1588	373	2222	4287	3525	2164	1350	5529	721	5140	174	316	5661	4042	3598	5360	2429	4526	473	5522	3536	2953	2558	4528	2597
Row 28	5202	5131	5308	5839	1416	2082	1957	5998	5022	1199	416	2479	826	5144	1305	311	1910	2853	4168	4304	3425	2440	155	4415	3907	3054	5937	5065	5008	145	3911	1653	1910	2673	1803	4547	2911	1570	4831	1920	3781	1064	4177	5850	4765	5407	633	4186	5720
Row 29	4091	2838	1545	2711	4702	747	2428	4173	3784	4613	5028	636	5235	3014	2465	3785	4647	4486	3267	4653	2883	1575	4895	1940	2331	1800	5082	5574	5903	5503	3434	1902	777	4542	3146	4256	4016	3104	1041	1764	1683	1744	17	366	3361	2416	2191	3689	5455
Row 30	991	514	4513	2986	1960	3944	2336	3920	3038	2001	151	3105	1158	2370	706	1939	5674	945	3710	5594	5284	4122	4197	126	4127	3863	1092	1728	3851	555	1526	1736	3951	4519	2424	1340	4774	4314	2704	214	600	708	2902	5112	3948	1706	1768	1685	4945
Row 31	3604	4750	2499	3099	4694	5278	3032	5534	4694	1051	5493	4163	691	309	4288	5818	4831	272	1676	1302	483	2347	4272	739	5627	1220	3674	958	3555	2365	1568	1590	147	5955	5069	4768	3670	1227	299	2648	3929	1707	3785	4274	2378	5238	1807	1795	4668
Row 32	2264	4814	3011	671	972	5048	3672	4370	2822	1359	2832	3244	4133	281	2311	5357	5098	4707	4855	5729	1464	2104	5097	595	1785	4958	3127	4463	563	5941	5214	2006	2349	198	5864	4325	2885	2724	2394	3648	3339	1311	4301	5507	5361	4479	3937	3662	2028
Row 33	4432	3774	3878	1489	4808	2120	1212	5855	5025	4181	5599	4861	1845	962	5152	4713	5037	1343	4573	1655	2291	4059	336	1247	1883	5699	1732	1032	402	2187	4960	1425	2432	5406	857	140	2099	3142	2646	2349	1973	3304	449	5092	3565	490	4847	1891	1437
Row 34	536	2293	3039	5309	334	450	489	2360	5635	3023	50	1057	1820	3826	3174	4134	1137	611	5284	2888	960	3671	3502	1103	278	3981	342	2857	4628	3659	530	1598	4576	4643	3567	2894	4831	2500	5803	5270	3216	3013	1769	3421	1083	2787	3771	4444	3275
Row 35	3871	5711	4378	3629	4581	1615	3705	376	5105	5285	3780	3741	1485	642	1284	1375	4700	965	2472	5936	88	2972	928	1104	3303	3518	3136	420	4883	839	750	1543	3859	1307	5841	1388	2874	4831	5093	3188	3533	5099	1024	4474	1968	4247	3364	3657	1261
Row 36	918	1071	5872	3404	5934	1721	3956	3580	2717	2753	4597	3416	5860	2663	860	676	3099	4067	929	4420	2323	4997	1058	2264	2476	1821	5262	573	4343	4300	3992	4759	2689	2247	1897	1543	26	4572	4429	3452	3872	1443	1947	417	3014	1090	5961	1988	1473
Row 37	1306	5558	4403	3171	3428	4641	2426	2926	5914	1815	502	222	4438	1770	424	2083	3231	3071	2022	1554	5052	3743	5887	5576	12	2674	5631	1176	5463	518	2890	2853	4551	3191	3122	3983	1802	1258	5566	5381	75	3957	1049	5832	414	414	4994	3213	472
Row 38	1848	593	5002	4496	1259	1708	4823	1289	3676	3260	1670	5789	4018	5980	1536	5519	4358	2122	2015	4369	1509	54	3162	4974	5967	4980	1365	4988	4422	1612	159	1740	3061	994	4370	4309	3290	2142	3891	5924	563	1941	1838	4186	2498	3210	10	257	2760
Row 39	3081	2038	2288	469	1264	2504	2923	3538	945	443	5608	2505	953	2100	3688	1271	2468	5446	1035	350	4907	649	2060	4741	2972	2140	4004	2327	5333	5072	1658	2841	1788	3249	4787	4763	2092	871	2859	4286	5942	4427	5290	277	2743	4807	1533	5028	1359
Row 40	351	1373	4153	5849	2276	4276	5920	2027	21	4395	2886	2709	5295	4075	2765	4793	5022	3398	3130	5871	443	5018	2068	939	4032	1990	5909	1327	3274	5765	2757	4373	3213	4271	3776	1560	1489	3649	1443	1505	2481	1607	3702	5972	41	3965	4304	5056	55
Row 41	1984	1292	4309	1763	2416	2721	332	4929	1410	1134	3817	4595	3750	1655	4860	2451	77	5403	4504	1600	5044	5163	5698	5180	4605	3977	2675	2145	907	710	2202	524	2149	1389	5228	5518	2604	1939	3954	5285	1035	912	4852	1136	952	962	2723	4241	1561
Row 42	632	32	3167	2197	2641	326	2825	864	5489	41	5478	1928	3407	5950	1192	4735	4458	1125	1483	3049	5604	761	1517	4920	4764	5095	2251	687	4948	1324	1218	5810	5235	3453	1810	1865	1486	2630	78	2359	4847	4315	4287	5817	1871	2334	2300	2238	3227
Row 43	3712	1873	5500	5980	4334	2073	3966	652	2730	1	2084	5812	4591	4185	328	5309	3822	3077	1072	423	5957	687	4207	2980	4741	4889	5432	4109	4982	3590	5775	459	3397	3135	3707	216	1626	760	5961	1697	2140	2003	3123	3222	2284	5798	2384	1001	286
Row 44	1445	5794	1345	554	4548	3036	3937	1595	1087	4972	5579	527	3062	149	581	1556	2878	4248	1928	2139	4523	5847	3809	5682	4536	4741	1863	5817	4417	433	997	1119	2184	3462	774	3628	20	1883	44	224	834	2729	547	986	1005	644	2033	4898	407
Row 45	1238	284	1938	2844	2737	1268	4292	1408	3823	3156	3357	205	4964	2928	5150	3223	5795	2769	644	1805	3953	3140	1654	4712	1913	1714	1765	226	1527	3478	4768	1957	5938	4700	3608	1047	5307	3357	94	1259	2903	4156	4166	1325	1534	239	4503	5271	5028
Row 46	5555	2843	1214	5271	5945	1024	3012	4331	1733	2779	4610	3319	3701	1075	5747	4810	5460	4140	2751	3697	4547	919	2104	287	4178	4472	2325	1595	4844	3695	3825	4283	5182	4008	3020	5033	3499	754	5033	3147	835	3905	384	5024	735	1329	4914	4990	2595
Row 47	4879	3105	2969	2645	3783	4015	5818	1293	2445	1454	2370	5690	4024	1528	1215	551	2315	5341	1611	1995	1305	4083	3228	4260	1991	5371	4165	214	3033	409	1065	2060	3126	3468	4691	3574	1682	4049	3169	1194	2923	4225	3777	5919	1404	972	4772	4391	1318
Row 48	3014	3033	4123	5695	3491	3706	2795	5554	3524	1026	2378	1595	5147	5028	5250	545	5327	5622	2474	632	4201	2213	1321	2057	1786	2364	5607	194	583	4875	4776	179	3544	4615	3690	1777	388	766	383	5027	527	3567	5860	3949	2373	2375	1124	864	2176
Row 49	3397	2007	5004	5249	4085	5514	411	456	4401	404	5635	3299	4994	2941	521	5529	4281	1460	965	5245	1329	5268	5930	615	4800	3119	3062	3733	5583	2128	972	5852	1070	5386	3409	2138	4208	3170	3553	5027	4580	3747	786	4059	552	3121	4087	5720	5219

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.