panzilong118 / stickyHeader

Makes table headers stick to the top of the viewport when scrolling down HTML data tables.

stickyHeader.js makes table headers stick to the top of the viewport when scrolling down long HTML data tables. Slides for the presentation I gave at the September DC jQuery Meetup can be found at http://www.slideshare.net/kingkool68/stickyheaderjs

Versions for

• jQuery
• Prototype
• Moo Tools
• Dojo Toolkit

To get started just include:

0. stickyHeader.js
1. The two CSS rules to your stylesheet
2. class="stickyHeader" to any table that you want to have a stickyHeader

CSS Rules

    .hide {
        display:none;
    }
    div.stickyHeader {
        top:0;
        position:fixed;
        _position:absolute;
    }

Demos

• http://dev.kingkool68.com/stickyHeader/jquery.htm
• http://features.pewforum.org/muslim-population/?sort=Pop1990&order=ASC