sticky-header-js
I wrote up a little JavaScript plugin over the weekend that has a <table>’s header scroll with the page. What sparked this little endeavour was a question asking for this functionality on Stack Overflow. Since it was fun answering the question, I thought I’d go ahead and make a more general plugin type solution that worked for multiple tables.
Similar to my sortable-table.js plugin, simply add the sticky-header class to a <table> and the functionality will be enabled.
<table class="sticky-header">
....
</table>
I’ve tested it in all the latest browsers and seems to work fine; Chrome, Firefox, Safari, Opera, IE10, IE9 and IE8. No IE7 because it doesn’t implement querySelectorAll, the code would be a bit more icky if I used some other method, and you know, it’s IE7.
Here is a demonstration on GitHub HTML preview, and be sure to check it out on GitHub!
