PHP & JavaScript & HTML & CSS

400+ 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.
 

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
1223334444
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccddd
ddddd
dddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbb
bbbbb
ccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
aaaaaaabbbbbbbbbccccccccccdddddddddddd
LASTROWbbbbbbbbbccccccccccLASTD

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
>