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	4360	3430	3952	2350	5954	4367	1853	964	4089	2463	3081	4718	4674	5201	1310	3132	5153	5230	5153	3004	732	935	160	4979	3938	635	426	5641	5415	1773	4724	3775	5202	2675	124	5155	1041	1977	119	5130	4439	3199	3847	3113	2399	5157	245	1552	4386
Row 1	5398	4556	5118	333	4715	4096	4271	5350	4521	3911	4764	294	2634	2539	5496	5308	2663	4651	348	4639	4769	5477	3077	1967	3324	190	4366	2480	435	5918	865	5832	4473	5983	164	3188	4079	4434	2538	2600	2344	1302	2893	4978	3840	2388	4285	502	1039
Row 2	4632	5140	5807	4109	2217	1774	1432	2407	139	3911	2841	56	4776	2673	4529	4758	2836	1717	2837	1270	4254	5436	3614	5556	2328	2591	3395	4716	875	3897	5755	5507	3036	5561	3616	5253	1334	5047	1659	1473	2958	4500	1529	1733	1172	58	491	4008	1774
Row 3	3327	5277	28	2762	2891	5583	5090	5482	2978	3806	357	874	3560	5864	3910	3121	3479	3162	4454	2525	4821	5927	5483	3320	1455	1215	4491	1513	1706	2499	3287	5032	1776	3314	1794	4666	2897	883	4147	5874	4689	4504	748	2248	4367	4657	5368	1845	1819
Row 4	3822	4370	639	3749	3852	3959	5204	5067	2450	716	772	4948	4002	5804	723	1316	1597	5389	4212	2480	3536	4086	1169	2039	4834	3416	405	3490	2784	2250	5308	606	620	5947	4355	4472	3905	3558	3538	355	4274	4310	5302	2276	4113	25	3591	5710	5413
Row 5	1803	2190	2948	5889	3358	4987	4722	774	5392	2211	3558	1641	1519	4163	2260	1466	2518	731	5371	75	4269	5725	4349	2578	5027	624	691	5051	4214	400	4464	17	2589	1411	5905	5946	397	4626	720	5789	837	4277	1429	2355	2440	3689	3820	4957	4420
Row 6	3191	5032	2689	2915	3380	5266	1941	4003	5957	992	2217	356	5455	2233	2945	866	2138	2891	1262	763	3610	1051	1600	1886	2479	3954	4326	168	1774	3282	4587	4965	2313	1276	1879	5693	541	3820	3696	498	4811	5913	854	4266	2145	3798	5131	4283	689
Row 7	393	5046	4299	1443	645	185	3921	4599	4510	4089	373	1792	2676	5337	4104	3951	1215	3797	4492	5035	1492	4989	3845	1404	5842	2110	3549	3640	1241	1831	4328	1633	876	2627	3075	1521	2811	995	119	1321	5084	491	3112	1759	5827	1216	5709	1042	5012
Row 8	4200	76	503	3188	3921	1907	3029	31	5456	669	1271	1287	4996	2903	2162	1623	5977	3682	4433	972	3801	5753	55	4291	2864	1814	4118	4079	1522	5159	3091	5721	5235	3594	2909	3156	5500	5938	3187	4956	606	4457	242	5602	1360	2403	1224	1337	85
Row 9	5657	2309	3886	5410	2363	2176	2273	4176	294	352	5698	5453	3443	5419	4688	1036	2327	1843	536	2264	5029	5491	2870	3486	5732	2471	4845	2134	3695	182	2219	3351	2490	104	2760	4852	2280	5033	3028	2574	5385	2726	2026	2827	2144	713	3862	4470	2555
Row 10	4397	734	1584	3887	3603	5069	3618	74	3914	5752	3768	4095	1971	1118	584	2075	3878	5436	4355	2911	2464	928	2295	5189	2954	5122	1333	3666	2984	5802	221	1380	536	1805	5267	4138	874	2885	4211	4787	2637	1979	2882	4608	3097	3466	683	974	2901
Row 11	5037	3884	5365	5965	179	4554	2918	5301	5886	583	2284	5688	804	3664	223	2608	2930	4360	3481	5815	2571	2268	2451	4549	5150	1059	1645	2615	1741	2619	5516	777	503	4880	742	682	3433	3659	5982	3319	4242	2265	3006	5046	5928	3228	1653	2858	1588
Row 12	5134	2672	4159	1402	5123	2707	551	181	4352	3166	1922	971	2681	2698	1473	1561	3440	2154	4994	1098	2135	2312	5340	4399	5317	4385	4327	2545	38	1184	4133	5171	3855	2291	573	2978	4998	1124	3159	3350	4289	5080	4320	969	1778	5792	2529	5217	1946
Row 13	1522	314	4080	3834	5653	2479	3151	4038	805	5695	4075	1989	3827	3246	5844	118	3818	2821	5115	4941	5979	2464	3229	5058	783	4198	835	575	726	51	2520	2248	365	599	81	18	3078	3231	4055	3883	2926	2129	5871	753	5374	5714	870	3192	2534
Row 14	5984	2132	2513	2447	5361	1570	3230	3558	2405	3804	4284	2456	323	532	2820	922	613	2838	3999	3844	892	1881	769	3021	1752	1521	2395	1465	2391	5586	3999	2374	1718	512	4821	1078	2082	2050	4636	4486	5854	2920	942	176	3451	3761	1098	4063	599
Row 15	5096	1907	1490	977	2675	4510	2729	4196	905	4194	586	490	2193	2960	2207	2704	1781	3285	4785	3831	1920	3271	3684	4840	4212	3860	2290	1972	4957	353	2570	4053	2260	4060	5029	4934	2570	1758	3130	3474	5951	3716	3964	2143	676	170	4846	2456	3454
Row 16	3630	286	5374	900	3970	4214	5112	1829	503	1083	786	856	3653	4838	3115	1713	3867	2049	4283	5624	5179	1757	5574	2894	5720	1717	3570	5889	562	25	3343	4192	311	2717	5092	4280	930	4203	109	1433	5286	894	2289	2939	5731	5404	4652	3597	1453
Row 17	2934	3221	631	4690	2795	3525	4409	4511	1094	4298	5073	1119	1641	3264	1429	4357	2356	5708	5287	558	5816	719	5844	709	3007	2782	440	2411	1434	4037	3863	4367	1257	4493	3056	4052	2018	1465	2562	3111	5762	1635	4229	1402	4899	5657	5759	1254	5365
Row 18	5045	1812	5181	5764	1655	5889	2771	4437	329	5181	5870	4365	3043	4237	5622	1535	1293	3674	3552	2757	236	663	2519	1870	4892	3921	768	4549	3679	2021	3913	2723	3833	3093	2486	5488	2982	5256	3924	3310	4437	3794	1675	1479	2031	1297	3014	3323	4970
Row 19	566	80	5206	1229	2598	1075	120	519	1842	4668	4197	3863	2580	920	1695	5673	3406	1182	2654	2662	5106	5964	1098	2900	1639	2577	4930	2936	5590	2253	1905	156	2333	1111	1384	4931	2185	1503	5449	4027	170	3645	1889	2750	4565	3584	2422	1970	4766
Row 20	5076	4632	3871	5039	5730	771	677	2306	5701	3613	1895	1953	5517	2051	4286	628	3434	3216	2812	4936	2664	838	5105	309	2727	1855	4873	311	4276	843	5076	3351	5475	2947	2390	5204	3717	3067	1509	3418	679	3404	5371	196	5454	3656	823	2887	871
Row 21	3634	1823	3534	4472	928	3843	1198	2782	2715	1508	1057	3558	584	4408	3032	3530	797	2235	1247	3863	3744	4664	4541	1147	4034	4736	601	1690	5558	3487	2560	3191	5309	94	1662	237	3936	2860	3018	651	4368	4074	4208	4951	2481	1239	2480	3277	3474
Row 22	3727	1139	1217	2390	5680	2363	424	4415	2963	2113	3972	450	4673	1163	5759	4766	2825	5995	2702	5684	3012	3352	4052	1086	1559	3002	3567	2798	5482	844	271	3208	1983	1487	5598	1662	3850	22	76	813	2135	4048	1262	807	5210	1021	5573	2034	1015
Row 23	2274	1718	4027	5625	5769	5113	1184	2770	2679	3981	2252	3523	4252	5459	5505	5738	5057	1166	3587	5078	1242	4400	1213	5289	5661	2019	4499	682	1592	532	1697	3865	2249	5723	3490	2017	4836	4674	4787	1515	2655	1038	5037	906	497	4541	643	5553	5707
Row 24	4230	4631	949	2630	5843	238	2290	1862	4736	2972	3453	5267	4668	1318	1516	4391	4808	3533	3226	3482	2319	4740	136	3356	3776	1041	3853	2317	1684	3406	2024	5914	2036	2972	2543	1879	3209	4833	3741	1945	1804	1194	1211	471	2512	2727	4862	1320	259
Row 25	2087	4801	2577	827	4937	5933	4602	5977	3786	919	1661	1191	2942	1574	3227	5914	4117	5105	3123	2949	2846	5067	4753	4040	278	5224	551	3004	4085	1871	3263	171	671	5840	997	5607	5772	5599	5584	3558	518	1244	4748	3459	2818	1974	3372	934	1079
Row 26	495	3883	3924	5561	2635	1964	5838	1858	2514	2842	5943	4384	104	113	5055	5943	1110	4662	5715	709	4245	3272	1226	5489	2019	4685	2306	3992	2057	3240	5071	2551	1122	2995	2111	3757	4958	1949	5615	1471	4790	5557	5855	4893	5670	4909	4836	779	3570
Row 27	4550	1488	1815	1821	2714	1303	3840	1398	3608	1832	3455	848	902	6	1969	3896	2116	5726	2853	4065	5340	4324	2854	4896	4178	1747	4565	3087	582	5344	657	5131	832	2471	952	3545	3774	4791	4943	1382	622	2398	2229	1523	2403	4198	5419	4518	3923
Row 28	2271	2583	3262	595	5436	2158	4773	1183	723	1860	1764	66	2516	895	898	4987	1847	4442	2761	637	3385	4142	1259	5782	370	2782	2184	4568	2200	702	2490	4471	3284	5752	5066	2720	1910	3838	3902	2632	5697	5666	2698	2213	561	3595	1199	2407	2036
Row 29	3960	3043	5421	2101	4302	5202	2470	1083	1386	1038	3283	2087	3527	1753	5371	3279	818	2090	5188	4656	5992	1819	4352	5657	4516	564	217	2111	1763	2623	4146	5722	5666	3567	1823	3967	2768	4293	5050	4153	5330	2332	240	2856	4085	5610	134	4902	1699
Row 30	5322	3558	1690	1141	1909	1347	5657	2473	1564	1767	4236	4187	5913	3958	3853	3479	5780	1819	246	4072	868	4399	3401	3200	4638	257	1284	4247	391	186	5946	5712	3743	1636	852	5652	2983	508	2124	4546	2274	359	2733	2186	4317	585	5664	4096	2403
Row 31	5910	2167	3271	4309	5567	471	2947	5823	1754	1194	213	1939	1139	5925	5682	2775	776	5333	5757	1284	1457	4303	3558	1815	1035	5743	132	1619	5407	4227	4022	5317	394	1293	3626	5960	1763	572	5783	3517	1765	5996	5456	2904	5921	5137	5678	696	4469
Row 32	5435	1980	5926	3737	5537	1741	4771	5280	1872	390	4687	98	4411	4004	491	5703	1629	451	1466	2201	234	4982	3965	230	4437	869	150	3574	547	846	2043	5981	2825	1968	3718	2362	3708	2488	1641	5579	2878	328	5677	1288	4331	167	991	5960	618
Row 33	2456	2160	851	1438	125	1080	5875	993	1229	3449	1540	2074	5491	1520	4898	1459	5238	1260	5166	1726	2900	4745	4603	3227	4421	5890	1558	4587	881	1517	5205	3336	3676	55	4774	3800	1135	4648	4793	2363	2096	332	4437	1587	1852	3335	3045	1089	4594
Row 34	2210	2814	1493	955	1417	4720	5375	1306	278	3962	2187	1794	3166	5523	5470	3221	4296	3270	4355	2944	2062	717	5040	2394	5153	626	4246	2488	3671	5335	1081	5881	2149	2574	835	3565	1293	209	4871	1571	4170	1057	3364	1336	579	2834	4556	4874	103
Row 35	2910	1818	2165	3627	857	4559	2780	1483	2804	5267	5153	2138	347	5033	4286	2920	5868	1851	4213	76	721	5784	4246	1778	3147	5582	2356	5981	4137	1230	83	1047	3047	2247	4674	3904	805	1453	5386	3609	720	4539	5747	1066	3572	4033	3986	3439	5883
Row 36	2199	3515	604	1982	1760	2381	5129	1342	4737	5109	5478	5966	5192	525	3013	1439	5198	917	2244	651	302	5852	1370	4841	5598	2436	2412	3631	422	5851	3513	2620	3365	4117	4602	5125	497	3731	466	5234	2839	5944	5200	2031	468	2212	3469	5666	3128
Row 37	5712	316	3430	5563	1686	2270	5161	4121	4682	2791	4542	4532	304	1162	1896	4421	5763	1020	4918	3494	1486	4151	333	1429	3350	2363	1897	5561	5831	1562	2689	5542	1878	118	5105	3563	2388	4266	1683	1070	1057	225	5601	1360	1386	1497	5781	1149	2517
Row 38	4698	4642	4002	2848	4974	5431	197	1337	1327	5758	1167	2888	2447	709	4765	2565	5814	2327	4953	4079	4010	22	5135	4234	5622	495	5619	1119	275	768	3635	4973	5409	1637	1820	4383	1067	2017	5719	2393	1775	886	5281	4221	1595	4045	786	1408	372
Row 39	5738	5486	4382	5759	4621	2615	5381	5116	2234	499	5391	3001	4134	4363	2410	5770	183	793	837	2199	512	3229	3974	1398	2510	2194	2992	555	2979	4399	926	2717	3885	5308	2475	2506	1922	1855	1621	4156	2354	1012	1157	488	5374	3567	257	5556	4359
Row 40	1094	1755	4871	4323	5728	268	832	1922	3259	1386	4901	1658	2312	1617	5542	1619	4092	2048	3541	5947	3669	1696	2300	4680	2853	2787	4054	419	3044	3610	4778	4138	5364	3648	2460	5092	3916	3292	1014	1174	4677	5915	2831	988	1531	2373	2607	5623	4421
Row 41	147	5569	2089	1843	1868	769	4696	4655	4822	5115	1698	2431	3892	5835	1795	1540	2295	887	5455	5586	1900	629	4263	1814	3460	5251	3345	5832	1857	2967	4252	2004	2536	341	3847	4403	1109	2542	3058	5930	1656	4756	2361	5547	4591	4156	1087	885	5042
Row 42	542	471	942	1170	4733	2756	4629	3983	101	4461	5839	3068	2712	1842	5603	3053	5688	4006	4161	2230	1063	4091	3885	5818	451	3432	4408	4606	4518	5293	3648	5060	5763	4590	229	4495	1345	4857	2477	1445	3318	2316	4513	30	4158	4115	3082	3846	2120
Row 43	1242	75	3182	5332	3959	3000	5782	1391	1408	4388	5909	700	2036	4968	463	625	5196	4957	1970	4053	1434	3415	1370	3749	1927	1399	1906	41	4481	5751	2160	5722	5826	5342	5053	3784	2342	4835	5174	3749	3223	5082	4449	5259	4050	4911	5883	3245	3868
Row 44	1852	1298	5302	5266	2668	3050	1193	4067	4956	1233	2547	4707	3393	2268	4532	2735	1321	2316	5076	156	1490	2825	3379	572	1273	2637	4621	184	2519	1865	4052	4371	3163	3353	3637	5830	403	4829	3896	5358	62	442	4065	3455	2710	2596	189	4031	4912
Row 45	5265	4186	401	2089	1564	972	3362	4201	5592	3546	720	1457	1597	5091	4619	4950	2727	4449	5352	1556	2345	4710	1618	2786	2774	5072	5496	5370	5261	3526	4281	4526	1712	4681	615	3276	5652	3976	1476	5244	1522	2195	700	3119	1285	5318	2068	4012	3767
Row 46	1419	5568	111	128	1186	2897	2902	258	2392	2271	5518	5918	551	4044	1629	5232	4658	4905	4884	2634	380	4127	4155	2575	4826	1273	3860	4144	3340	1872	1910	4759	1440	2020	4887	2625	4916	1788	2883	1308	4058	2401	1225	4609	444	2854	3840	5101	1758
Row 47	2723	1734	2138	849	5889	4713	5675	1161	2573	3818	4501	4444	5727	3260	5884	1747	2146	2508	662	3933	5391	1969	1991	1791	3194	600	2234	48	4440	1334	1805	1162	3068	3943	2011	2956	2655	1686	4116	5227	5503	2617	3671	5230	5876	3554	977	2022	62
Row 48	1639	5955	5452	3608	1945	1242	801	2544	3475	848	984	4809	2653	2145	1876	595	4156	4831	3250	5842	2947	2477	5345	5564	147	4575	5439	3701	5551	1461	3762	1189	1415	3213	4796	3359	4455	5597	5903	1930	444	886	738	3097	3031	2613	3692	1187	1444
Row 49	941	1028	4390	3417	372	3953	3564	4946	3392	1264	4497	4852	5026	5685	267	2239	4481	3625	693	4077	3528	2622	4521	4414	3360	1617	1445	5973	5308	2631	1416	248	3659	5806	3665	4031	3759	1229	2977	1151	2492	1473	3	1517	1158	269	3756	5638	3893

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.