Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

CSS & HTML: Sticky Header

Bottom of Page

1 to 2 of 2

  1.  
    • CommentAuthorsquawk
    • CommentTimeNov 29th 2008
     permalink
    I am looking for some code that will allow me to create a sticky header. The only problem is that the element (
    ) will be positioned mid-page, and will only 'stick' to the top of the viewport only when the user scrolls down and the element actually reaches the top of the viewport.

    I expect this to use a minimal amount of javascript. Can anyone help me out and point me in the right direction?
    • CommentAuthorgogogob
    • CommentTimeDec 4th 2008
     permalink
    Producing fixed content is pretty straight forward.
    Checkout the code of my website, http://www.w3a2z.net.
    It is all about turning off overflow for html, body, inserting the element you want to persist in the viewport, then putting your content into a scrollable div.
    You have to define html, body{height:100%;width:100%} and #page{height:100%;width:100%}
    I simply cannot think of a way to scroll and stick though.

1 to 2 of 2

  1.  
Add your comments
    Username Password
  • Format comments as (Help)
 
Back to Discussions Top of Page