possible to turn content thats scrolling to a fixed position at a current position on page

I am trying to find away to make a one page site,

the first view of site will be fixed. each layer that scrolls in from bottom becomes fixed when it take full position of the viewport then the next frame slide in while scrolling.

How can I do this?

Is it possible with just css? If not what jquery plugin can I use to do this?

Answers


Are you looking something Like this

.header{
    width:100%;
    height:20px;
    color:white;
    margin-top:-10px;
    position:fixed;
    background-color:#000;
}
DEMO FIDDLE

Need Your Help