Skip to content


Repository files navigation

jQuery Floating/Fixed List Header Plugin

This is a jQuery plugin which allows the user to create a list with floating headings while scrolling, a-la iOS & iCal day view. The plugin allows arbitrary markup of the header and list items, and will work nicely with nested elements.


The Demos for this plugin live under the examples/ directory. Open them directly in your web browser, or view the following online examples:

The following are Demos not included in the examples/ directory and can only be viewed online:


Basic list setup

The basic setup will work with any standard dl element with no extra config options.


If you want to use the plugin with any other HTML structure, you can use the 'headerSelector' setting to tell the plugin what elements to use as headers.

$('ul').list({ headerSelector : 'li.header' });

Other capabilities include methods which will scroll the list to any heading, with optional animation, and a method which will report the current heading that the user sees. You can also bind to an event which will fire whenever the currently viewed heading changes.

$('dl').list().bind( 'headingChange', myFunction );

Full plugin documentation

The Documentation for this plugin lives under the docs/ directory. Open it directly in your web browser, or see the online documentation.


A plugin to make lists with group headers that float while-you-scroll, ala iOS contacts.







No packages published