1

This is really stupid question but on http://thenounproject.com/terms-of-use/ , what would the effect be called where the information the right hand side scrolls up and then stays statically in place.

Also, is there a killer jQuery tutorial on how to achieve this effect?

thx

timpone
  • 19,235
  • 36
  • 121
  • 211
  • That's a floating navigation bar. Check out this thread http://stackoverflow.com/questions/9346557/floating-nav-bar-that-stops-fixed-to-the-top-of-the-page – Bort Jul 18 '12 at 18:55
  • possible duplicate of ["Sticky" Scroll Positions](http://stackoverflow.com/questions/11547346/sticky-scroll-positions) – Matt Ball Jul 18 '12 at 18:56

1 Answers1

0

Without looking too deep into how they're doing it in that specific example, I can tell you that the effect can be achieved by looking at the element's offset and the window's scrollTop.

If the scrollTop is greater than the offset's top, that means the page has scrolled past the element. You could check this in jQuery, then modify the element's CSS to give it a fixed position relative to the top of the window.

Edit: Threw together a quick and dirty example on jsfiddle. Feel free to copy the code, but you may have to clean it up a bit.

Travis
  • 12,001
  • 8
  • 39
  • 52