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 03612328152391324485325103095844173145594971897190353732548342398234918632014534164450724143183204629124311212253331304573426135431057146630531366130947835924280568018275653570566020512053
Row 12523406425874166457150001348616191256592738124496324713857150535285322455748936313340481691130206425632724130226134776382467713621990524736233385863227329962601351639585071137354632598695
Row 24020149013251360306223643799482799110222495412587873881239206253351600539951973873239517971388353868276158153466345538354956478051945261101535732083813467524573224455225303312579045912646
Row 31390399018435262385364065073745073410552197286443869275643358018865811523964470582628521694437853815005416739721650555719623493481823461132546830825638287736331610374120192537338355982725
Row 440407503120251057659724203495353533208312033244858267652852350149416303481961471231193838234447291578436312664961396039903001471011105510528610813713423843392013583757577840333042212755274671
Row 556084873383272643255727145559024089272048622049710186275818201372442900508442813333456381090578136714131190831972802151536841844241200959105696191039982416772463125263480449444005847
Row 6184430895128517730934766266287424364396478156331197296331713814536532512904231123552886462006533437714639138271526449854559573211237352825487740015698131323964478946359347734263497433093587
Row 726415404822555121868274885595754665022267221097123018401184965466549952965436230853612840125429541613551619274921310321904611924174126462751625260322165647527443245653503164577154684828
Row 847662432319050731793293264746164158426725622944286110224868460236681618522727038344873554321574526462321429755141149306219464338213437384367246024837230131545685245151590411246165257
Row 957303842552735632715507057201241511620415537462931902599574152747324311589411927935900349339474682737396120588492576131457941884141413132591038614373502559023909365430915074227461852392538
Row 1045114313331441139231277487866052379351509181322492087223030892285362299940893734202339901643567710802150390356971389441420818193771261857425048149640142852431190997468039952327176942231689
Row 1147672311542379030010664661380321543691077460448095284423258019021641627339756459115828247384507468233527546904023504210013446583113004511296268017264664375632934733039751534940915
Row 121679233714781590216539511598671441939339463109195659874109540158175409391111320885636477758435965224928827162301182216303980415931085570323105811689935476510019392584105519256934561742101
Row 134366185421884002630203139672879491246825180733312316048913419273052134477389720639532997214553640524069122945075811132928731665351787522945547484251734458352443525191383515124082125342413295
Row 14572921373501368151345645421731853714544616923524774456551884291544014823837428165422951804500614865638517556789147572861620894361430127625183212371919634904124227373468430102729071911
Row 1548631188256511582991157126432629208722103520844507141391737543124391764543749574976315591938794397365513474826468142547373544544133024701243248721344506095935532579180226237183538205431575302
Row 161490211342774644303221563041686350318675367175626032910119759051611362847762954268857345075267153531295984507351823141437567252532652531622844807235629702309422323364065825524652617308562889
Row 175506381055765239431648437741445482758476261967422112981219873613350356792969473198811912808532016205353132745290922022251719177814895034620226347854462110110414123312401263112033014134
Row 18882598360628691174341329213189546622345934237544362184309321336732127832593626042772046370816892376109431935793123445244603105505713294278247042501467193648314014310491835841403513112573529
Row 1959621193133239323838401927561439482463192107046971651417537542979245222412283919215917115319469629290318715759415954005721535255325959258933721886220213192131539323898281044563458140233015
Row 2048045250933963961252143115893154330213481313270210686642234102732535605291254559245042484833125869589138754449391389032533163182342164123207456475712522729491059540565021271204188331534456
Row 211488643910241151052757572349732648359834225604487675372230948901845238345361556161014842615214911344741335230171894180845041957571891510622474637355121423534575681272241313403303130215247
Row 225413155780310223040341831714174215952311904052233056949204760810704521124511043642547945603322220026917255230571159714643126777456654307419128352480349335836704401568833634409173539715478
Row 2325552155823897469451421219894183219431241543191447662809268744311116878126635961227462312655627431146284035452599351330018144095419650732365415140150681357152461032712903419595747214534
Row 2483559862129206246093394168829192022572329634620323632634331330145994045668732340363322293864424254994154166054562874193291286023222352146857154040438617363762134935599846117882327691727
Row 2589294140664524317019302766266983442521252957461824155816940476612836542806566823905671017274515645627353238915696525847836373324330638075253724755336449625992292311450142107405337803389
Row 26470758530571096115140733841271537001373606339663053884032395426941838320727652313254212614911483443753924940242717034329113322871385222934385458701533158144275955320721474585252840422
Row 273232560527355773866164546065240556955461667127238742800355952595029997471650981150187453919082426261020541010263548941432586644994167563953645811424446045380379027065216643070421192220985207
Row 2856381195357151117332264393743424318494797732123798421710454548010744356472456773735251359474387417630162597509851131804473530821602462040442441823822741312813585953350622001662205126792735
Row 294061402241241413915235925272091537451231188448792759234794308616883415094350121642501478257342024984477258641034145125991439285350105579767136821062858742122840455229215539684023524041354857
Row 307492485724998396226453200294614173063397928675661541857194671499648639110133437812329138894483535540323723349028884471597429593469393656046688811020373148603886339142773605206232724090
Row 31210043731432288070228192889518421749202907566338081378563776748463572370551444531389324533125275636158828792697485996847963232240016763933521845643116139254842310543291140069040572454262
Row 324426575927145815300325508936381612196733447129345130370253338051634455153684750594348514772996214217216861984175947462417526604438317826853526816429654921149476624262792467175910834101
Row 333104512851252530216221248144317932933164122092880264238455394702556122232227376519171915255284414418041751590328875852212333727024632639432317114082116464357232325152259864709106146884270
Row 3432849144646380226321703086776197348366784860468788921971389135248355712306229175827170526392152322626258614287131251301570222637755372485739452457563359181293310477759801198973136825505808
Row 351079561227249061316536330584542198839182828329930474397552482237684381476622540134683151743233459149655204431286420704239394216819624847299632519051537231258224365561128692762513536905303515
Row 36245575415281137227158504596376653703027629143912654571312022273418116255153221653486351431744732011277836075701330811222155406126503292331249918874097186949134726330817832964272404713543
Row 37495535219538185177221222901188499058978882297101930433573668334688167222147852035113435105342131180657693715151831126701552250548772947162777191737052674280523692584735813591801046
Row 38152624005830356035333339290148444144267025585662298052281214548557141943420124913859190651646631907285551022654214690331057403090314032996234792005466462328692024428458481251549853329651441
Row 39353234555299543826185962134454734723608368711619183426425040577254872453592443383157379236114413640161193929722575237950430167859412647164012842120211148925807327158093233152138653957393
Row 4024004881473055572673509099731270119363284327643143787330559913728595216315012207237413903187810123712511025321577306729253976194716543532461974345294930144346522144719477812023476937281974
Row 41399273940454140642592351514353503316835929209946073905404526114362663100359651593244642938071164520738073187397615345160437542733205251449153128166532672160334831964258195511002302221525364965
Row 4232182501558566329294364827213621704013111370431734485197737899989135052663415756641013523921196524522234179498751881396148757451059441641091886552279589966239823071514759583448145848
Row 4395328085005616281835745374782280847602960179539474356328136925415169718011300224820791198291060426920561817172201866266950085870328518252271821606303458035664828452719212109221913363805
Row 444019263553973832296215721015017175381712181040485225910376920501136558926564170169221299846962142510691434772911493311229635029394359255186434942536138601594004344384131021122433
Row 45244517015088615187053093612565145027171479492756284115038259154402981251546263024145639868831615438652261998569513384430214030393518275449082826365547342763082952320227101362224053008025220
Row 46181554272243327034133126488417982351882149336895311363272728293865634565575151073931383358113254214203372584222212591165616484834492550601959380985743104690234919984001598127248303662358
Row 474841116146544144948152255465490294229185331516255089868104342591158693003719726460924093075606409305533301239342156871722453611521363484267356822973561525992303477721073289558644831995455
Row 487479171805356332632545962373530932914973372929786952265412983157488025132721416311150245193521823124778566555104232412427441257673752166557281487197430194595702599711541966412619841714
Row 494927249644345343560734574535482457683313448852781545490057045956466634561621439449423594141354003296140955352615534253797444615032540738044638286423393462263256511949190911958481612115155145067

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.