The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Sticky header that scrolls in and out of view

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #173206

    Hey guys, I’ve been working on a script in jQuery to have a sticky header that hides when the user scrolls down and scrolls back into view and sticks to the top when the user scrolls up. I currently have a live site with some code that works how I want it in firefox but not in all browsers. is there already a library that does this? / can you help me with my code?



    It’s hard to tell what the heck is going on, even in FF, the top bar seems to work in Chrome & FF but there doesn’t seem to be a lot else on the page.


    Rather than calculating where on the page you are, why not worry about the movement change and constrain the results – see this Pen:

    One caveat to mention is the fixed height/padding on the header and content container.

    I hope this helps.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.