GitHub - kingkool68/stickyHeader at 05d740f20fdc730e892e3d6906a3cbfad0438497

kingkool68 / stickyHeader Public

Notifications You must be signed in to change notification settings
Fork 16
Star 92

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

92 stars 16 forks Branches Tags Activity

Notifications

Name		Name	Last commit message	Last commit date
Latest commit History 7 Commits
.gitignore		.gitignore
LICENSE		LICENSE
README		README
demo.css		demo.css
dojo.htm		dojo.htm
jquery.htm		jquery.htm
mootools.htm		mootools.htm
prototype.htm		prototype.htm
stickyheader.css		stickyheader.css
stickyheader.dojo.js		stickyheader.dojo.js
stickyheader.jquery.js		stickyheader.jquery.js
stickyheader.mootools.js		stickyheader.mootools.js
stickyheader.prototype.js		stickyheader.prototype.js
table.htm		table.htm

Repository files navigation

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](http://www.slideshare.net/kingkool68/stickyheaderjs)

Versions for

* jQuery
* Prototype
* Moo Tools
* Dojo Toolkit

To get started just include:

0. stickyHeader.js
0. The two CSS rules to your stylesheet
0. 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/](http://dev.kingkool68.com/stickyHeader/)
* [http://features.pewforum.org/muslim-population/?sort=Pop1990&order=ASC](http://features.pewforum.org/muslim-population/?sort=Pop1990&order=ASC)