Question

Possible Duplicate:
Swap CSS class on the basis of Scroll Position with Javascript

So if go into themes and select Preview you can see the new layout to gmail. It has a tool bar that has your archive,spam,delete,move to, etc.. buttons. It starts in a static location under the search mail section, but once you almost scroll past it, it remains directly at the top of your page. (and vice versa)

I have done the div remaining at the top of your page before, but not the part where it starts at a static location, scrolls like any other part, then once you scroll almost past it, it remains at the top.

Any idea how this was done?

Answer 1

The trick is to use JavaScript to determine when the element is at the top of the page as the page is scrolled. When it is, apply a class to it that makes it fixed position.

There’s a tutorial on it @ http://jqueryfordesigners.com/fixed-floating-elements/