A simple script to make tables scroll with sticky headers. No dependencies. Works in modern browsers (IE10+). ScrollTable in action
How to use it
// ScrollTable(tableElement, options);var st = table height: 250 ;// Set a new heightst;// Reset (remeasure column widths)st;// Disable (remove all styles)st// Enable (apply styles with last set options)st
By default ScrollTable tries to do the minimum amount of work to make your table scroll. It sets styles on the last row in the thead,
the first row in the tbody and the first row in the tfoot. This is typically enough to make the rest of the rows fall in line.
If you remove any of these rows, the layout of your table will go wonky. You can set the
styleAll option to
true if you want to protect against this.
Or, you can call
reset() to remeasure the layout and reapply styles.
Colspans and rowspans are not yet supported.
table// Integer: absolute height, in pixelsheight: 250// Array: the desired widths of the columns in your table// Anything else: ScrollTable will measure the widths itselfwidths: "auto" ||// Set to true to apply styles to all rows (slower, but protects against row removal breaking layout)styleAll: false;