PHP & JavaScript & HTML & CSS

700+ CLOC JavaScript. All the sources can by found at GitHub

Sroll the table headers out of view

You shoud then see the pseudo headers get sticky (position=fixed) as needed as well
as columns and corner headers from the left alternate between sticky
when scolled in x direction or , sroll when scolling in y direction using position=absolute.
 

See also demo.html

For table with id=t1 the configuration looks like

                floatHeader('t1',{ncpth:[1,2],nccol:2});
            
 

ncpth specifies to take one header column from row with index 0 and
2 header columns from row with index 1, to create the floating top left header corner.
nccol specifies to take the first 2 columns from every data row below the header

As of 12.01.2014 this has been working for :

IE9 , Chrome Version 23.0.1271.97, FireFox 17.0.1 , Opera 12.12, Safari 5.1.7.


Delete or insert rows within the table below to see effect on left column and headers
Rowindex :


            insert and delete works here

Normal table, two sticky header row2,
two sticky left column

122
012233344445555555
aaa
aa
aa
aaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccddd
ddddd
dddd
dddddddddddd
aaaaaaaaaaaaaabbbbbbbbbddddddddddddccccccccccdddddddddddd
1234456aaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaaddddddddddddbbbbbbbbbccccccccccdddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccddd
ddddd
dddd
dddddddddddd
aaaaaaaaaaaaaabbbbbbbbbddddddddddddccccccccccdddddddddddd
0987654aaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaaddddddddddddbbbbbbbbbccccccccccdddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccddd
ddddd
dddd
dddddddddddd
aaaaaaaaaaaaaabbbbbbbbbddddddddddddccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaaddddddddddddbbbbbbbbbccccccccccdddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaabbbbbbbbbccccccccccddd
ddddd
dddd
dddddddddddd
aaaaaaaaaaaaaabbbbbbbbbddddddddddddccccccccccdddddddddddd
?aaaaaaabbbbbbbbbccccccccccdddddddddddddddddddddddd
aaaaaaaaaaaaaaddddddddddddbbbbbbbbbccccccccccdddddddddddd
LASTROWLASTROWbbbbbbbbbccccccccccLASTDdddddddddddd

Normal table one sticky header row, one sticky left column

IdentificationCell1Cell2Cell3
Meierbbbbbbbbbccccccccccdddddddddddd
Schulzebbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
HELLObbbbbbbbbccccccccccdddddddddddd
Müllerbbbbbbbbbccccccccccdddddddddddd
Schweitzerbbbbbbbbbccccccccccdddddddddddd
bbbbbbbbbdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
GREECEbbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
myDates bbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd

==========================

Normal table one sticky header row , no sticky left column

ABBCCCDDD
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd

In an iframe

In a DIV with style='overflow:scroll'

IE11 (10 9 ) and Opera exhbit a somewhat 'shaky' performance while scrolling
Chrome 32.x ,FF 26 and Safari 5.1.7 perform very smooth

 

IdentificationCell1Cell2Cell3
Meierbbbbbbbbbccccccccccdddddddddddd
Schulzebbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
HELLObbbbbbbbbccccccccccdddddddddddd
Müllerbbbbbbbbbccccccccccdddddddddddd
Schweitzerbbbbbbbbbccccccccccdddddddddddd
bbbbbbbbbdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
GREECEbbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
myDates bbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
Meierbbbbbbbbbccccccccccdddddddddddd
Schulzebbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
HELLObbbbbbbbbccccccccccdddddddddddd
Müllerbbbbbbbbbccccccccccdddddddddddd
Schweitzerbbbbbbbbbccccccccccdddddddddddd
bbbbbbbbbdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
GREECEbbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
myDates bbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
>