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	3792	1472	3508	4165	306	5214	524	892	131	1761	2774	1857	1080	2211	3678	392	2735	4914	2570	4319	805	5793	3778	3274	1340	2264	307	1161	2341	1399	3364	3257	1247	3692	3209	4436	194	2805	991	716	4827	1874	1096	2014	5033	3814	4976	340	3124
Row 1	2493	864	908	3151	315	3013	4668	711	5009	3665	3671	1576	872	5927	477	1180	3480	5516	1184	4443	5103	3297	2039	5212	5173	2918	1763	1973	159	328	3109	4401	3137	4625	710	2017	2065	194	4269	2740	1065	4697	5075	1287	4510	4783	3486	154	1749
Row 2	2095	4206	1234	5472	1724	2663	1102	4314	979	1098	3428	5331	4297	5427	2090	4577	2299	5834	1291	3069	332	4469	4066	2869	5057	817	4443	1228	4011	746	551	2094	1713	3467	5869	5935	4514	3684	4412	675	5147	4095	1454	4017	360	5007	3532	2516	529
Row 3	3142	841	2434	5813	3921	5565	5798	2372	1034	4349	5121	3086	2384	3096	4512	3588	3545	477	472	3551	2041	4359	827	3792	1230	2117	1126	127	4744	4398	180	3346	2682	33	5825	5846	4963	1326	2055	4691	3195	5752	3640	1022	5888	2074	5853	2422	1316
Row 4	5502	4485	1066	2227	2661	2717	5679	461	4927	995	3692	949	5709	5102	4236	5721	972	2960	1821	566	3742	2104	30	3398	1062	5840	4379	984	1792	3309	1595	3583	3463	3045	2009	2597	5916	4835	1656	3264	354	4298	4682	3832	534	3350	2065	388	2221
Row 5	2249	2695	854	1786	1059	3524	997	4840	567	1636	3525	4347	771	3139	4662	1859	5751	4540	1735	1610	5438	1055	1728	4019	2260	3981	4178	2071	3576	2244	4895	2513	5045	4589	1264	2277	4770	2874	3946	3724	503	4234	3675	5479	2367	5178	5523	5733	236
Row 6	1635	5155	2991	3548	5636	5327	5524	5085	3570	3280	318	4050	597	5425	1752	5719	4868	749	3659	3316	2332	3691	5747	2005	4308	2434	2328	2355	3116	1023	2910	5703	2375	4590	1460	2738	4747	1449	2685	2348	1706	2438	5887	4965	2049	2019	808	1060	5309
Row 7	4736	2273	4405	2855	5468	155	1383	2961	3061	2621	3727	1611	2871	5358	103	3412	655	2491	3796	5665	3557	4362	1511	1199	242	3457	4527	1826	2708	668	3229	4711	1841	4962	4523	5872	4337	2475	4353	1133	2825	1707	5087	993	1250	2768	4527	2494	2038
Row 8	3943	1087	2948	2997	599	5142	3650	5031	3657	3842	4060	4511	328	4753	480	2560	5305	552	1422	2122	3991	4885	4089	3298	2453	4327	4313	1601	1292	5077	3863	3354	1220	4028	1031	1197	3014	5349	4142	561	1129	5606	3798	5717	5504	1317	5846	3770	5560
Row 9	1279	3687	17	4919	5595	38	1555	1750	340	2914	4841	2713	102	2443	2629	1874	1326	4964	1896	2176	1072	4126	5877	2008	4382	5609	2963	900	3672	4319	123	784	5880	1602	2028	185	2696	5826	1586	1819	4417	4092	3723	5299	3510	1300	2029	3822	1259
Row 10	1212	5962	1289	3780	4898	4937	5173	2990	2257	3312	3216	1932	873	2877	4129	408	4442	5965	4628	5292	4976	820	2595	3896	5920	2342	1910	282	1234	3806	5943	1337	4365	1166	2945	5132	1673	5923	4570	417	1791	4707	2406	4586	1226	5407	4541	1223	4402
Row 11	4838	5533	5825	3347	1366	5178	924	391	3425	5724	3369	2230	1514	5166	3146	4917	4299	3660	4906	428	1801	2176	5879	4220	1530	4994	4233	2600	832	5071	1168	5079	591	2389	2338	452	4521	1632	5682	2520	1981	1081	5735	1991	5952	2060	1558	5353	2368
Row 12	2472	5525	122	2056	1752	5139	4301	889	3688	745	5303	245	3164	709	2366	5595	5715	5974	138	5662	2742	4548	3357	1562	1983	3706	3154	4086	2303	4101	972	779	3200	1886	1462	929	4366	4231	2975	607	3652	1415	3745	2998	1497	3238	1629	223	1286
Row 13	1125	5771	4427	370	4889	471	1874	5717	3384	553	5698	3312	2662	4504	3328	3868	324	4603	4982	3418	5537	3741	2278	5865	3871	5170	2227	3770	1401	4428	3661	2248	1587	5843	4247	1212	3473	2130	5590	18	3633	4941	2581	1236	5943	5054	5508	3239	2799
Row 14	4397	1551	5422	4193	2041	5076	5627	5898	5837	2833	1621	1617	1940	3925	5743	1876	4317	2906	31	2499	5877	5234	4663	3945	5330	2398	1183	3062	5388	316	5377	168	5624	3886	1189	2772	4302	5074	5785	5415	2322	1376	3433	4621	3017	72	5211	2230	3912
Row 15	1622	4963	1070	2829	2273	5271	4358	1004	5607	4949	789	1099	5458	76	1833	1653	4732	125	253	183	5279	5475	1501	2891	4250	1380	3045	3554	1875	1956	132	5455	3295	885	52	5454	2656	2734	2455	5739	3156	3953	3274	3408	352	1265	5567	318	27
Row 16	3081	3838	2542	1411	3190	3705	1674	18	79	4676	2819	1930	289	1627	2912	5912	5633	4006	2691	2114	2194	4897	4061	5225	1190	3709	5944	319	5939	1001	416	2499	5830	2572	5361	5610	3736	5800	3229	2427	658	5076	779	5601	2926	3980	4928	2878	2159
Row 17	490	3133	3080	1145	863	2052	270	2287	2080	2806	32	5814	4989	4957	5562	279	2431	1108	586	5986	4595	1705	3818	5997	1465	4093	3424	970	3498	5223	800	767	2907	767	3568	1081	2426	1261	4800	4808	2284	1617	1505	4356	2527	657	4717	954	480
Row 18	3856	2138	1848	4778	3812	460	1084	3078	5675	4924	2812	3860	3185	1898	3736	5818	5230	5011	199	788	1982	4246	2513	343	72	3201	363	1207	3923	3320	3860	3314	2190	3016	1206	4819	4243	501	4882	2203	2108	513	2784	1302	5199	4025	2896	1609	4319
Row 19	1596	1344	5091	2777	1140	4897	2508	2798	3547	4095	5928	2551	2287	2032	5074	931	5136	5833	1568	3323	754	4354	1569	2703	841	2318	3912	1972	4888	78	154	2019	287	4351	4643	1706	1605	1697	4588	4408	5961	4174	566	310	3744	926	2162	4309	5028
Row 20	4782	2414	5676	5829	2783	3447	2196	4058	5176	1004	301	3909	3249	5239	3178	2827	2938	4687	5140	386	1806	2758	4918	5411	1072	1816	3466	5094	2220	3126	1131	484	107	3621	4179	3714	3546	4851	4470	5617	5355	3408	3258	2034	3886	5852	641	5475	1066
Row 21	1134	4342	145	5927	5655	5947	1988	4099	5542	2027	251	3338	3374	1439	2209	4212	4374	223	2858	2929	2943	5866	1098	4607	1270	2247	4069	470	2569	1952	3977	1129	913	1840	5860	2941	4010	723	4063	306	3625	2294	4815	5469	5775	1791	4950	1468	4543
Row 22	2277	1581	2666	2268	4632	5952	5829	881	4747	5205	978	2913	5050	3944	1659	2544	4841	2754	4866	3178	6000	4943	4810	1179	471	4931	676	4159	2095	3875	60	1035	1944	2326	5637	1414	5939	4542	3540	5323	4340	1077	1383	2253	3562	647	108	79	4725
Row 23	80	2490	5229	5382	3251	3483	2766	4550	4112	3650	4146	3738	4986	5609	4232	5605	870	2288	3123	5510	3783	775	2686	5267	1595	650	3367	5575	1112	5377	1416	4926	370	2474	675	4901	218	4177	1107	4348	2296	5282	402	2925	4957	252	4665	4497	5435
Row 24	4026	1137	1438	2076	4064	4367	1219	1750	2476	1924	4811	4219	3964	1749	1741	1850	4503	3842	516	1322	5548	4995	1120	4887	4133	891	1325	3452	1487	17	5884	1780	5576	1641	4772	1753	4245	4696	277	5519	4934	3325	3768	1035	5483	4610	1729	5700	2877
Row 25	3635	901	5116	3715	2940	3305	5156	731	2851	1729	330	884	3371	5841	2905	1961	1730	5519	2745	4183	5172	3553	5339	4597	1670	3550	960	3121	5957	1890	5228	4701	864	2117	5680	2086	741	5090	832	5669	5971	2131	3555	5534	691	4291	4065	5527	2506
Row 26	5202	2241	4475	3611	2587	4614	3497	2165	2775	418	2398	3954	2625	277	2938	4377	2083	3887	2178	1581	3388	1317	3665	5435	3409	5902	2870	3538	4417	1932	3205	912	4390	2263	2459	4320	625	4043	5348	3484	3712	2073	4072	402	1645	4865	2596	4987	5542
Row 27	4863	2632	5749	4267	625	79	3129	856	3385	5191	4260	2689	1718	5709	1924	2691	1100	24	629	4806	5976	5216	1587	797	4361	3306	5522	1497	5525	1828	1086	1820	5254	741	4430	5832	3821	5470	5462	720	469	2488	4281	5223	4635	2717	4926	1139	3811
Row 28	5503	1299	1873	1034	4114	1043	1303	1650	4376	3251	2532	4990	2871	5627	3481	2907	1132	2807	104	1960	2744	259	2874	3802	741	5866	2392	3911	1872	3406	2939	4753	2269	1559	1566	5811	2870	4577	5235	4447	2267	1132	5717	1531	2626	4604	2090	5024	5528
Row 29	3206	4571	963	297	4203	3202	5751	5131	1864	1832	3399	4552	634	4583	3294	1495	2979	5709	610	4201	1472	4687	3291	1964	876	2618	226	532	3958	752	3358	2965	3862	58	5947	1697	4484	777	4548	3225	1776	5496	2754	4849	900	4813	2817	4642	2948
Row 30	2734	3827	3568	5534	1577	5176	1075	3646	5086	1753	3787	3179	2848	4931	1654	4076	5862	415	943	52	4281	3047	1294	4982	4286	4630	2468	3446	3405	696	1726	5055	4633	2609	257	4810	3246	5879	3947	424	5791	919	1689	5879	1829	5226	1645	495	5623
Row 31	5231	4489	821	3227	686	2403	1018	3121	1153	3193	1470	5965	1646	4551	4744	1555	1040	661	209	5120	410	4237	1521	874	5012	5456	1810	4628	5570	2566	5450	143	3333	3318	1469	1776	5535	380	3392	4286	965	5159	647	1954	5646	2677	4206	4042	3874
Row 32	1396	4942	5037	2128	356	115	495	4274	303	4492	5863	4125	5371	636	880	2455	3052	5824	5354	5906	2366	4442	5338	6000	5054	251	2414	2402	5202	5494	1012	4482	3290	5807	904	4200	3254	5036	5208	1331	2490	1535	817	5350	1662	673	3582	406	4583
Row 33	4534	2307	3453	2608	5228	5770	5861	3881	5648	5379	5549	830	4236	349	1142	4534	4400	4762	4218	4107	510	3638	3971	273	5774	2703	5807	4270	1935	5428	5773	983	5010	1875	2046	3659	2438	5335	5418	2703	4212	2410	717	695	696	1377	3870	526	5766
Row 34	2476	3175	837	2887	3763	2557	4941	5145	5410	1868	3295	1960	3122	5349	4443	5314	4495	1577	3559	3406	2571	3843	1988	5582	2	5026	4258	3122	620	2258	723	108	917	5989	1161	3291	2800	5260	5571	4902	1694	3647	2269	3499	1899	2789	5749	4427	5107
Row 35	4344	4518	4034	698	5118	701	1459	594	4358	5027	3210	2572	1122	1401	1333	2205	528	1373	3600	4036	50	2657	4806	5337	2380	699	2364	3870	3519	3844	1768	1685	840	5865	2623	3582	4058	211	2655	1310	2945	4826	2146	1580	1056	672	1042	4609	1172
Row 36	2960	486	810	5930	5643	3576	5059	4360	3339	2211	2519	1807	5088	3824	4968	4272	1471	1660	295	3228	3434	1672	2946	4485	5078	4634	2432	5616	4291	5103	1548	2315	2291	3843	3107	5785	192	1542	4935	4717	592	744	2272	3695	470	3530	4589	5298	3934
Row 37	5182	1575	4620	627	4513	191	1304	4499	1889	764	1456	1386	4781	5626	5549	5791	3399	3437	1036	4398	3361	3592	2342	3888	4338	1166	5975	849	3257	3262	1763	974	5581	5299	5471	4294	2610	4031	1433	3544	5569	558	1259	885	1425	3234	1313	3978	4579
Row 38	603	3354	1140	486	5312	2668	4447	4719	3839	1634	3566	5536	4775	2671	4730	974	135	5577	3306	5238	4526	4427	2196	137	4475	3011	3359	4038	3393	1320	5737	3738	535	3550	4730	3249	4156	5770	4754	1757	2605	552	1798	4461	1308	4586	4208	5070	4356
Row 39	1259	749	2618	1425	56	570	1000	3079	1874	5719	3716	5766	3060	2190	3174	679	1370	3872	3668	1326	3032	5646	2865	3871	3663	4812	747	39	1068	1716	1922	2270	845	2884	797	4304	3050	4782	2095	2024	4143	5860	4796	675	526	1007	889	2113	1492
Row 40	2094	2988	243	1285	1077	486	2085	3510	1220	5858	5038	3507	3802	5078	4142	1220	2488	4609	248	2740	5516	3216	5535	2251	2863	647	3511	5280	1529	739	385	1437	4153	5866	349	4649	3747	3189	1879	2323	3790	4011	3632	3799	4285	5198	2268	5660	2377
Row 41	2487	4250	1550	5414	3271	4643	4582	4120	997	4719	342	1734	5471	1814	3303	1927	514	3241	1798	2328	1598	467	4513	3300	823	5222	5685	4490	613	2133	2680	4425	526	2084	5720	5624	720	5139	2670	3932	2325	1568	5536	1809	940	5040	5257	5025	5999
Row 42	1786	2415	2266	160	3750	5398	4002	3280	1586	3824	2718	4752	3425	3105	5735	2314	2402	2188	474	2329	5292	3662	3354	5346	599	5429	4846	4922	5050	4193	261	66	2714	5151	845	1818	5760	1855	5294	1629	33	4878	4547	3963	1238	3182	3105	4321	215
Row 43	3984	689	5195	5102	1770	4604	3287	2431	1275	1977	3778	2233	2374	428	2284	3627	3552	5966	3614	3436	2712	2858	2778	371	3172	2451	1403	1510	2370	3738	4812	5355	2828	1848	1696	1788	5677	2369	1143	456	988	1446	2048	2785	1340	3682	1357	2137	2478
Row 44	5212	3836	4005	4755	2209	1193	976	2903	844	3032	2720	3858	4282	4023	2202	1273	790	513	2390	1462	1019	5202	5647	3605	3803	3541	1923	3194	4216	1472	4178	4718	3920	1084	4628	5505	4402	35	2645	981	902	3850	4753	619	5548	5336	2693	2157	5382
Row 45	5018	3784	4548	52	5189	142	5817	2969	2582	1085	1201	548	5343	2895	2725	540	5756	621	1409	2998	2746	5452	362	3259	4718	4415	3686	4252	3090	4625	4182	3753	3940	3382	1933	3767	2109	3599	5829	3015	2375	4065	5940	2877	2742	5255	1190	2489	2177
Row 46	5622	5662	3311	3359	4048	1644	2683	134	1050	4626	5376	438	2343	4758	737	1472	400	1191	1765	3567	1188	5681	5519	1421	4172	1254	3977	4872	4034	564	4203	5979	4991	1739	1690	4665	1824	4374	137	1019	3175	1195	4595	4646	157	2909	3003	3496	329
Row 47	581	4292	3420	5716	5372	2931	3939	4430	5402	5770	5295	5856	4648	3966	3655	4465	2136	2030	3998	992	5692	5525	4429	1063	395	5374	3565	3176	3195	4117	2237	4231	5814	3795	5732	5286	589	2522	5202	5411	3847	2704	5923	4631	5092	2014	5829	766	3667
Row 48	4482	3404	859	5814	1373	1083	5498	4832	5770	3368	5725	3858	1944	1628	218	2162	417	1926	4164	3949	435	4357	3039	947	3800	5690	4569	4842	5354	2458	5308	2983	1722	3876	4926	5117	1642	4475	3151	5541	1494	356	5751	4591	26	4356	4627	5067	894
Row 49	1541	4168	4553	1040	1144	1813	634	4456	3036	2382	5762	2300	1776	3644	763	1620	1542	688	5396	5495	4831	1888	4347	513	5339	5230	3584	2299	3004	4360	2031	1632	24	5680	749	4623	5135	2253	5518	2630	633	567	1526	3757	733	841	658	1097	3525

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.