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	2767	4766	4218	3516	4738	1907	4448	4035	5867	5977	4987	991	5555	2753	118	3267	356	5488	1760	702	573	3772	2857	983	2766	4005	3155	2988	264	3561	1185	1397	5376	1237	5707	3661	3877	1130	139	3653	3600	1025	4984	2169	5337	1475	2441	3182	30
Row 1	2653	5090	2790	5545	1918	4460	2844	5097	5564	220	1003	3932	2398	5474	2414	5525	358	54	2657	1221	2002	2710	2491	5529	5590	1859	1865	5052	640	2603	4287	4206	5463	2054	5289	537	3069	1728	4264	1794	4658	3297	242	4225	2499	106	2230	5638	4712
Row 2	4835	501	4359	1720	3396	3944	88	371	3000	4861	3914	865	4215	2784	935	5431	54	1627	3640	3709	601	1210	281	3297	4445	1538	5499	2607	1959	3208	846	1958	4851	4710	1093	2478	2154	3521	1667	5149	2592	4206	1929	5526	1178	3840	535	1936	3589
Row 3	1500	2697	4116	5852	191	4817	2805	1687	3087	4669	3331	1756	1093	1595	96	600	4245	582	1495	3677	5820	3881	2627	5037	835	5867	4729	3200	344	287	3563	5612	1898	5663	3855	1097	1366	5184	5173	4657	3276	2208	973	3062	526	2119	4810	5947	4593
Row 4	748	334	216	1515	5124	5333	1994	1633	919	4668	3450	1042	1278	3651	2702	962	1894	5863	3316	4196	1844	2351	3105	195	214	2950	1315	5173	4326	5156	1232	1691	4434	5557	3929	4509	2038	1635	1069	216	275	31	216	4685	5013	5410	758	3730	124
Row 5	5422	4806	5529	448	3288	4665	1074	1864	212	2914	707	1873	647	1742	2154	187	1633	2322	2040	1258	3383	4521	4784	922	1766	2013	2044	2847	2759	1159	3573	5013	1544	4920	4352	5864	535	5329	21	2848	5034	2201	3761	4270	5827	574	2640	3154	1992
Row 6	4331	3979	4317	3550	4468	4618	2673	5911	2576	2072	2854	3858	1241	5358	3487	1205	3448	889	2158	4838	1957	5689	3647	1755	5912	3445	2515	2768	5095	2912	672	3592	3506	5302	3985	2466	3951	5009	461	2471	4442	1031	1299	2613	403	5463	2720	1608	5298
Row 7	2463	147	4792	487	3854	779	1619	2119	2134	657	553	5711	317	5275	3570	3268	4398	3253	5413	1818	1004	3515	4110	1983	2273	2466	3152	749	787	52	1731	3098	2311	2370	1525	872	811	4593	2391	602	3904	2155	3946	4240	1429	2136	2680	2164	2388
Row 8	5527	5514	4475	503	2518	3295	3956	4803	5186	5486	5119	1438	5108	431	5230	347	5309	1600	2066	3659	1069	204	1791	2454	2096	4507	4651	186	2889	5950	1291	3601	91	2278	5212	1059	4958	2747	5013	2351	3960	295	1706	465	2454	4050	1335	4548	4109
Row 9	3486	1114	614	3900	4623	5486	4803	861	476	4454	203	2505	5737	5937	5817	3055	1176	678	4449	1314	1448	2675	4233	2990	2176	841	5108	3147	1718	3553	1189	5595	826	4883	190	3127	3876	2534	205	5528	2303	1811	3266	4043	323	5727	3428	280	1841
Row 10	3654	140	2098	1465	1189	4585	2636	591	4502	4600	1037	1255	1488	673	1104	2310	4308	3060	5378	4133	5678	1681	4249	340	5003	2921	104	1270	4704	1758	5009	1521	3636	701	1475	3874	115	1925	690	3797	2782	3835	5832	302	5221	1290	3859	4550	3115
Row 11	5448	4165	2566	4774	2018	1540	218	4257	3213	3717	1592	3919	811	2246	1781	4516	3161	3071	3718	5966	1692	2888	5369	5848	1344	749	3651	5754	2065	4148	1331	4219	1947	1300	3905	5368	185	4047	1334	1402	5253	1216	2935	4149	2391	4342	2966	2357	774
Row 12	3201	2494	4640	1061	3487	5505	4872	2313	4304	5366	2199	522	5361	3288	4342	4587	5717	572	770	1502	1704	2645	4236	5799	5119	2961	84	2453	4912	77	5257	2686	3505	31	1590	5309	4984	2959	5475	754	3428	821	2038	4832	2218	4758	5526	2626	2072
Row 13	5086	5494	5125	1005	5170	4501	5273	5685	3074	5320	5856	4337	5358	4576	463	3338	3880	5389	347	5987	1707	5018	4903	705	1009	1677	2933	1245	2974	2012	4117	482	3869	3918	5562	3033	5363	4714	2686	3205	450	2291	1091	3713	2970	1366	2680	5333	5526
Row 14	49	1670	46	289	93	406	3257	3338	588	4042	5882	846	490	5595	1380	4054	1940	522	1967	5642	4354	4541	5700	1855	1104	996	2858	3844	3658	3841	4701	5581	4876	5437	3600	5925	4661	5702	1368	548	842	3155	4023	2975	2422	2944	2952	3211	2429
Row 15	2990	5375	2985	1312	3660	648	2693	4326	442	5181	3643	2946	1697	2670	2785	4407	4582	4976	1960	2281	4968	2329	3729	2559	5830	4951	4605	5740	1419	2429	1100	406	128	2521	615	5499	2385	31	3321	210	275	3972	4226	4218	3576	4492	2679	4817	3595
Row 16	1783	5173	858	5226	5888	861	2201	5070	294	2038	5034	5072	966	2540	1052	4156	3578	4325	1107	1515	4752	1066	2702	3227	2772	3170	2824	1801	4848	5554	4553	3800	1477	291	2288	720	4686	2653	2682	3858	5720	995	4193	782	3347	4996	1305	1370	4375
Row 17	2687	484	852	791	1499	1987	5489	4917	921	1284	78	3241	2017	2343	4777	3620	5676	1204	776	5561	4916	2722	2861	3512	616	5062	2001	3724	1136	1560	232	1998	5838	1807	5082	3746	2190	5847	3175	171	521	3434	690	1641	2771	1237	532	4364	4867
Row 18	3061	1971	2606	2413	5747	517	1469	2428	4424	150	856	3138	2970	2493	3622	1225	2020	3557	1098	2755	5296	2000	3632	5551	2704	1388	490	106	3679	2612	5038	430	3017	4198	2776	3649	985	3541	265	3104	4713	3212	800	2136	357	2034	2687	3225	3724
Row 19	2424	3385	3053	1696	3354	4896	1429	664	1209	4263	3438	5615	43	2137	101	3714	5924	2419	1007	130	3545	1543	5335	1042	2635	728	5273	1602	624	1709	3947	1079	1638	867	5985	4402	5181	3847	123	1363	2490	4101	5540	495	3052	5137	574	4082	1140
Row 20	4166	3556	1851	3138	93	2057	5334	5926	343	1487	5285	1338	2126	2020	2024	5819	1738	5746	576	1305	673	4620	3686	2205	2890	972	5368	2939	431	3053	5507	1315	757	1733	5105	5289	1410	2545	3646	2190	3083	3751	661	560	4174	398	2754	991	5793
Row 21	1778	4536	1278	1513	2778	1059	1682	4908	2031	235	2540	3692	5491	2187	94	3904	4224	5943	3333	4245	2258	4877	24	1472	1065	239	2585	1824	4189	5600	402	1163	5028	5734	5820	2902	3992	363	1701	1276	1502	4139	1816	2557	391	1235	2933	4795	4173
Row 22	1990	2814	5303	709	5397	1994	5483	5688	1998	1677	636	3323	5494	695	3389	1258	4714	2768	3060	3384	4447	2322	4056	5840	4902	4489	2223	3201	5015	3753	1007	4342	5913	2044	3507	5296	2105	2349	4871	2525	3874	4011	810	280	1681	5791	5931	2870	3002
Row 23	795	4399	2934	5959	5553	152	5223	5702	2945	5534	4917	2728	3557	3381	5801	1311	576	4156	5464	497	185	3975	1412	5741	4231	1250	4342	2718	4901	1015	3628	2271	3390	4036	4264	5907	864	5011	605	4322	5417	5333	5966	2919	2765	4382	4414	297	2005
Row 24	5443	165	4478	844	952	5277	729	5370	5626	2638	2647	1307	3078	2266	1661	1580	5288	386	3496	3758	4779	926	462	3179	2731	531	5620	1087	946	5617	680	726	345	5706	5513	1226	3912	5272	642	3845	2786	5582	3861	2422	1462	2546	4059	5639	1393
Row 25	3581	4803	5691	5245	2359	81	2078	817	4742	5094	3421	3392	2534	3049	2984	2606	3064	882	4878	2961	5939	4274	3465	5109	2529	3073	959	2597	2652	5604	644	4464	1841	458	4142	2103	2305	4377	1732	396	5238	1095	5038	3465	5828	4329	116	750	3137
Row 26	83	1432	4393	1825	2695	2491	2167	2021	164	1116	2684	5456	2009	71	3904	495	2480	5383	5439	3292	3921	5601	1661	1887	4367	4969	2336	1344	5170	2277	2042	499	416	3557	5	5931	2892	3816	1064	3424	3046	4817	2602	864	3190	5086	941	5645	917
Row 27	3967	603	4323	1276	588	2375	894	4095	5608	5740	4086	4019	1345	1202	5354	2683	2094	5844	1987	3928	2016	196	2566	4802	3360	698	287	3718	4745	5424	1848	1120	620	5324	5897	2674	3210	5333	4235	2471	2335	5372	3502	5685	2655	5107	1759	1361	4041
Row 28	5968	3446	3123	1740	4336	3809	16	183	2210	4401	685	2062	2699	3079	5715	3294	2374	4179	3649	5065	1082	7	555	5254	3343	2855	4695	2668	832	3123	4760	3669	2113	1527	3645	2395	2170	338	1281	331	545	2569	1308	5918	1634	5166	651	4604	122
Row 29	822	1461	2217	50	1337	5076	1960	2472	554	2122	3792	4550	3998	120	963	3542	5412	1142	2636	5351	4199	176	1781	2352	3131	4587	3917	5152	4374	3460	2814	4622	104	2492	3640	3189	4089	3056	5148	233	5609	641	1221	4268	2806	2571	2840	1305	2407
Row 30	3793	1799	387	1861	1560	2651	4661	3461	4506	296	1404	4448	3	2012	719	4305	5361	3671	4346	24	3450	5144	1692	106	5662	5159	4203	5078	1899	3070	4546	1515	5230	5092	1734	2996	1282	4058	2318	882	321	4776	1893	3409	1943	5484	5742	5678	2713
Row 31	1068	5304	56	3945	5645	5666	3503	5054	4219	3677	1538	666	1885	2398	4847	2763	4254	5236	815	828	3462	3782	5926	4765	2204	836	4781	1506	4651	1353	1943	5418	642	239	1389	2081	2105	4788	3792	841	5572	2972	3224	5953	2330	5265	1878	1512	386
Row 32	2599	1797	2909	5617	721	2716	2256	4906	1966	2090	3477	2602	4896	3012	3605	4336	2896	2511	714	3881	5556	120	820	598	3819	918	4081	4784	1440	5316	3175	5592	3960	5560	339	3096	5273	254	3802	3211	2995	2315	2946	1132	5466	3757	4630	3637	1731
Row 33	3849	2880	5157	2891	1977	1647	1626	1774	716	1134	3216	3984	5917	1081	5015	4550	3276	416	391	4514	4969	1098	3974	5730	3419	4622	3030	3569	231	2391	4849	694	2139	476	5230	5342	776	2988	3403	4474	4114	3704	942	3209	4802	3478	5573	5002	3728
Row 34	3844	4711	242	246	3608	1907	4722	541	401	1918	3406	4465	3300	4808	1216	4970	327	533	4797	1990	844	5601	4430	4746	1712	2101	541	4642	2523	801	951	1700	2822	3921	3230	4390	5544	5387	5550	5858	413	760	2493	2101	5717	4485	4167	3018	2256
Row 35	3936	5230	1227	5559	4091	3960	3506	249	416	1890	3763	5906	2606	5304	832	4598	3231	1317	2965	3543	5160	804	3216	3457	5018	4641	2362	2729	3939	5187	1699	4352	3892	951	2395	277	3342	834	4006	2810	1991	1920	1734	657	3184	3340	34	2639	3913
Row 36	4409	1542	5362	5048	5623	4806	1992	2069	4276	371	1322	4644	4502	3387	5963	5444	3929	333	3013	1909	5544	3656	5429	1589	2710	479	5367	4706	6	2089	5802	3277	1553	1512	1521	4701	5142	1522	1910	4628	1929	2076	2768	461	2739	1434	5001	4618	84
Row 37	5158	4559	4500	3634	4467	1586	5553	4974	5280	2875	1773	704	1256	4235	5274	3193	1467	1678	3225	3678	2207	1777	1237	985	4644	794	5273	3861	2806	2492	5370	994	3030	1128	2350	739	3523	3376	387	3177	5670	4499	2458	230	4644	5744	2961	1931	5999
Row 38	3966	2921	2302	633	2361	3924	68	2029	2860	5926	5366	2536	308	2627	5572	1649	4797	1155	5392	4232	5465	4736	5283	429	5244	3408	491	399	2055	1351	5461	4754	575	4180	77	2291	3966	264	5604	2742	1950	5983	272	5385	5862	1367	486	1167	3498
Row 39	3371	3484	4202	5147	1931	1081	5635	75	5118	4559	3392	4661	5007	359	5835	2623	3243	5293	2541	4026	3497	3101	3675	2737	5364	577	486	1368	3805	1731	5415	2097	5032	3182	74	4634	1616	4636	2991	4922	3989	3671	2996	4177	417	3953	4080	2114	1174
Row 40	2865	4115	4726	1642	5178	2130	5225	1733	1458	617	3969	758	2596	4875	220	5247	5992	5301	4954	3886	2440	4382	1015	2489	5015	5480	3462	917	3969	2208	681	2398	135	295	5453	1740	2290	4504	946	866	3585	1342	3590	49	1892	1226	2355	2393	1486
Row 41	2767	5727	2406	5983	763	3791	2649	4001	1248	1268	710	1034	4276	2028	3250	1978	5616	2384	509	1374	5093	678	5823	3986	4238	2170	4758	2944	282	223	5826	5545	5424	4004	5614	2034	2709	1188	900	5629	1610	5850	5991	2369	1990	3303	2261	75	4371
Row 42	2327	4397	2024	5206	5897	2101	5347	1643	4743	5770	3651	3772	5113	3207	2875	4312	5623	5841	4392	2295	1326	788	1497	4402	2088	5333	799	189	3842	3203	40	5786	3420	2248	4824	2399	2452	1873	2168	5765	4899	1918	3529	612	5033	344	5795	1360	5638
Row 43	893	4123	652	1414	5974	5810	4251	4450	2994	3686	5050	2459	1833	3803	890	1357	5691	1552	3883	375	5880	521	4913	3182	609	5622	2331	2913	1254	3548	5338	1233	1421	5510	3988	5566	107	5722	2668	3059	4933	3975	3165	827	1139	3584	3998	2198	2021
Row 44	5855	5521	3182	814	1935	486	1571	1853	3791	5441	5222	2219	1002	5370	3504	5551	3196	1729	3676	1242	4409	5527	185	3261	2053	3161	4161	3477	359	917	2372	2920	5619	1270	5486	1005	4790	444	4306	5029	731	3297	4670	777	4111	2363	3521	5537	5456
Row 45	3276	3220	1359	5398	3775	5287	5589	1451	1637	5084	5121	1431	3079	3364	3825	4418	1468	5802	2923	4791	4237	1316	3729	138	2146	850	2856	3945	4212	235	1044	856	4644	3809	4381	184	3925	5814	2635	1056	1373	5788	3525	8	3993	5981	5480	3121	5416
Row 46	2987	1510	3466	5783	1165	4774	1455	753	919	3716	2073	255	4043	4162	5765	441	2781	511	2628	3302	4443	202	5596	4212	4675	4782	1917	2161	66	94	5675	1424	726	737	3843	1062	4784	4272	1954	3386	2114	2888	4153	1594	5983	3740	4943	1576	4606
Row 47	1151	4258	269	2435	1244	1341	4973	1394	5977	5138	1661	2905	5395	3587	989	5714	5671	2434	5224	5409	3728	2518	2847	5908	3033	4199	2861	2871	3080	5025	50	2067	997	3667	2284	1406	1067	929	562	5076	1833	2685	784	356	2427	936	313	1596	1021
Row 48	2280	1281	1936	1660	4907	5268	2551	3706	1834	1167	4313	1377	1942	5239	3737	1758	4172	2218	631	749	5472	4918	3555	4319	4737	4298	5755	1228	3530	2009	2651	3661	4795	1130	12	4592	3969	4796	91	2934	4495	5551	2298	516	5873	1901	1493	5957	2503
Row 49	1006	4813	5391	2142	4698	2610	1550	2683	47	3484	2814	1804	5111	2634	3825	5727	59	2956	5825	2357	2814	4534	3639	2220	5241	2791	5213	3812	1924	1825	2992	1178	4651	349	1189	2352	4729	4283	3897	1902	260	5502	625	2658	1150	3390	4160	602	2972

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.