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

Home Forums CSS What is this thing called and how to implement it?

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

    What is thing effect called when you scroll down a web page but some part of the header or whatever always stay on the top of browser?

    I hope you guys got what i meant it.

    How to implement it? Please give me link to any guide if there is any.


    Something like this?


    As I know, Schmotty said partially right but it’s done better with JavaScript/jQuery. And it gives better animation and effect.



    Yes that thing.

    Is there any detailed guide to it?


    Erm. I’m not really sure. The positioning itself is quite simple, it just starts to get complex depending on what you want to do.

    Anyway, I found this out, might be what you’re looking for. Or it might be more complex than what you’re looking for.

    Also, I don’t really know of any specific naming for “this”. I guess fixed positioning divs?


    I’ve seen it referred to as ‘sticky header’ and I think @Schmotty has it right. As suggested, remember to set your body margin-top or padding-top equal to the height of the header. This will offset the body content so that it sits right below, but not behind, the header.

    Sticky headers are much simpler than sticky footers because it’s much easier to predict where your page begins as opposed to where it ends.

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