newbieman
newbieman

Reputation: 65

How to make jQuery Mobile list dividers fixed at top

Is there a way to make the "data-role="list-divider" fixed at the top of the page until the next letter or list divider comes up and takes its place, like in the iPhone contact app?

Here is a link to the jquery mobie list dividers demo. The list dividers dont stay at the top but rather scroll up and down with the page.

http://jquerymobile.com/demos/1.0a3/#docs/lists/lists-divider.html

Thanks for your help in advance.

-bob

Upvotes: 1

Views: 2807

Answers (2)

Sam Sehnert
Sam Sehnert

Reputation: 2943

There's a great plugin which does exactly this, and gives you custom events etc. The project is available on GitHub and there's also a showcase article about it.

The plugin allows you to use any selector to define which elements are headers, so your case will look (something) like this:

$('ul').list({ headerSelector : '[data-role="list-divider"]' });

Although, you're probably better off to use a class, or element selector for best performance :-)

Upvotes: 0

user700284
user700284

Reputation: 13620

Check this out.Not sure what exactly to do.

http://jquerymobile.com/test/experiments/scrollview/lists-divider.html

Upvotes: 1

Related Questions