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 0495359292152939119023804185232722274241496353832110435947052387289338313313570438672323412533893627188627661489257310327835913281965654955830338237320116128595036174266500051719226713544
Row 1353143721759222776556917751386656962702178213722737573251074151256132017205923366170735234657196934321891471511895226364023814285641614150320984193205682291348871041494590491625475468
Row 2257437913921264356544715298284021386324074437366757115045062496314935311383011691730229526431827469033452963070472429473696300034851240848594251769692320146836383936240933251446129930212240
Row 35487367538284400514650001102473559094396559923823687787302653202921202225661015791222120924989513313273971612360027253743044635369741723351651420151545183518635323902883525511163919936210
Row 4123342051673110208541132340137128765783401100436273235347256072049821752520539185941472322552062165051693755899368952682484290370350705230142749854854174610168743653101559681595465345613769
Row 5216215354759590757775023583610223434715417520050052652138540557682605579627526849621182511134851779014568280243318202646422828028302114156751761717567823758391840426752984039226359184718
Row 642751411495796957402534713404171316271604306037746291639978350528611073240587841804135293050781634363531822469406842942709383217955914244103648964219597953841972566952595607511741462990
Row 72616381620834968590755322181207795250075129440448044900109937035907357536555859555114951151737344620795978191158165686334757701158124854615151272038481261494613493256189214905759883359248704770
Row 818835837397444845751351539043240352359372989265234111818438957122885975735463532312973108247129044336754493659511763119350351445645621477047061464378645782750246404643136285896320055692110
Row 91911392290153547883880241340713653079726503657758825664865670577439582655574171403301659882379305054001355527328469774793454292212514715523270156913013587526445032930275852077113869
Row 10320634811217301824155787703184966514556202287445238432810563939748784987240215714174508428848912271486146010252951157497641922340569971657173521469415149333018420332842234511456343605942
Row 11532218473850100552793743161813181509330592513441884261048943327100214358955426309110935610736260610512120463839625707451815503523594359853734106317967152513385523253313139231102378240841813
Row 125333059556580629052970553633401503451245744949874518727802598283505452747511648208637572958352743186435324225550819271593135453902792136130412242344411111247136525845243725369031532
Row 135132441950283368454133441637787181528330325048344811801114220528935504217391611651369352134005504501127566350525494360311625893688345027458093375505341494839243810691523139121358391851100
Row 1426551546396543419505382268444364729586622282371117315325976649368745314851309238234790377391928358795867740105536383993416528512960398436671495789424258281234052042305343541133484587198
Row 1556451546397725519845922839506159705022951581735244604964249812092129586050802587176213644244426311723495164450344237260814192494182305122612574455582027322407461516928110065580175348184155
Row 1618935288102445651723487171749693142506273630981106577022661579520741475409426627801790116256274544214244803134316033433191465102758423244136347349375558429545850511747193412802597380829715232
Row 172552442449832480364438062174824394419359582909373940013333274207747911807403241795600385914755753354741341868512842907331714475717662961564751442921268258813812499402840113655432375516004567
Row 1820565998792812361013954938413315445335323853987662230359221455190422932523513571252422633661254391951834921147857095815493021495538179838733543928865028141121042472488656263776308046735411
Row 1923959174359231618772893522543619503085360651064644515827651435020598735661226418350663962309211146495016335615450015467334928188531235773372123365301422715024011574518718665609115317424691
Row 203349163247134256370650798028904021493842875730381836643462149815982839483464645744894431915601614571573023633281584314495049535548177203068597834813714211571955031436389523942155903344004
Row 2139271666485750241992466741501117251754727655252484951917522625813516429014245131659600046731545516775226129736821105484584755881983568223215785630121920634622570828854872246240752693997
Row 2236855793112834825562382218425313221928529024395319852922038112526983168589753694391574019275406539949755904481550415739395670222949015666596594844217684552753821124448542453219473344293563
Row 2363453954853462043475155207613713627920205538326553626505891242318940911954894441430063042448916678303292343128836642573399586847865202416848631004248136766142009500040785228593432471722
Row 241459454550345645247838381312479459891661455633118614085288671040759454653953035101744892768873141329673079830427610331663902410719644239104525274327187239854238599268111314605453414154833
Row 254881207234750831905522813424699394938292583358133464376236357727303453783886362448958032481479049613240281438479611310345527874584107927750645815180378945024431433723953941446852965162677
Row 261150539617154121319144201356112578222823869238154891134132934873264487354043711966596444710225654556627761703751565915272271518156783663261742144534686473439946034484501920054249546592139
Row 27940351844920114468331730271224234012754684446558865912968345329703471375181357715102853441730522409250658646948253062498652983746859475032370750111945954242468730491552533165912174245
Row 2886829353066296940652519671540248378465454755092239211824136643269496051492522514270852442705161116044020351979466716372860289226102106315955482910381650554541119927351794459618294625
Row 2934562254311418272532509359924045747367899822414102480778413420933546795534220952527063042310446315165648365668241186357601623207851225472561355396742073367838949565324470445454535978
Row 3074329252059905913911753128513945433360647055270350226663887384158191101235216819455538590335462199231455001525560551709492041750587250873764593930934350259461220221143316366922902411637
Row 3133183627231752253060553528641136444710650231857561734503432466149024447189325983263489325941009285750073868479612848594009366020939333776429634563994904133346312721125441994033776214713562325
Row 32587695920895968352638481648371352934125473209384344395003556713625009346442771347148134793633284226131081473381520341421589394526842552276187047052551207416542032258225932984276348255886
Row 335185012350529462569179054345835458019703375782550214561980304932191558268747635050368745875715435725727972629144116265792367059042164754354101424358504232277057203429465234505132229636744648
Row 34430054195624178933197458734424063506947205877501358673811141440046891056221032893709306212599115341052741299338852143189543782996391859049642933317441105541905188232441044109159356763430
Row 3556472551277511737105322538148072293106083338303584572636115968416435444397121112157321942617764011536417099192373385044494782520956143662141291052309051451592126487740891396585840414101
Row 36562222813147479044724307129310291231221115113557502056462652445032428229457752557143693228756943939592429676294565304224315924234013665145155446721581212829294925384749243543192155756415395
Row 3721654379478388710874518500625703940246512801665153312124707100470953214184491494718371531109411251845930108340705451820342934025462221858329713653432831485760411134891810524857673712778560
Row 384715310761115543907490124303538355212844181303311841161307318633995429740961705738186640592340236711411292458446521983876259620118004898428650835084905123449211513264240226083208455454032947
Row 395479425910184987313519022235337524219392243286459838341707947422999681451117931345557478793119024130298150176842347134111694870527920608145505432526265467326147830864101874276154662371
Row 404935415612083334202551825798212031275639914549188021594461440222648883712924153811871551208539565463195632181729157310915116209511293668162741371582306922042159115457345514272956255333377
Row 411248114858015357282478918358797233532366532329213552187252554623481926982312240925175492543799838423277282858361458465359202645134517753350193757669397422163411982499846462610462153575805
Row 42350757231004749171311072835348475539154884468910822705444326991691396243887422922126520159734606705294947621154011783305829243725155945774564172216787418937612284533534155171529431284699
Row 432703328525763554129132734893242208074625404131160529085339316515753110855803519930324522872567344353992474637402033520912131638326208451023347473359413535279648145215331231194183515715934864
Row 443424223117945825588921605248314819642307244131732621191413115490183828145774199948292947535946536333651842160636911355281958555716271015874572257745584197415957522395562850402958195912738122032
Row 45410812156974486146443889611088643295564822033368411656183311571069813378360720614873397379227165326527521823260406411783897561423595758390742411728306149646523931181324010575652096304
Row 4610404724383125594342341516021052251573733213877354447349531189125229435891520325234221490918862531922226927611918428857432286503138138211692206954981804218498744504415220631683274457125665242
Row 475593511982050381182289533342806242188468035442891491753855469204126348325951875320318355046522377253439124122506723262703556549166075735549184041515375347036721368223941483220253282599
Row 48249658774352283324091468102646275592341620042190469336534884479089249214129171854033573492457095050147430614036191710917054864515366130927361808393520203751576151665000547529494482377811492033
Row 492910438449753272212941343016462057873219562638292961188576216345497581341743362981254140153713102234223124537221811534341064145054715068567834193143370338026005481436517141307153325114852182

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.