Forums

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
    Posts
  • #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.

    #104358
    filipeb
    Member

    Something like this? http://jsfiddle.net/xpWG6/

    #104379
    Wordpressive
    Member

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

    #104440

    @filipeb

    Yes that thing.

    Is there any detailed guide to it?

    #104443
    filipeb
    Member

    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.
    http://www.noobcube.com/tutorials/html-css/fixed-header-footer-layout-a-beginners-guide-/

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

    #104463
    yinzdo
    Member

    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.