Wie man einen Header beim Scrollen repariert

Ich erstelle eine Kopfzeile, die einmal zu einer bestimmten Anzahl von Pixeln gescrollt ist und an Ort und Stelle bleibt.

Kann ich das nur mit CSS und HTML machen oder brauche ich auch JQuery?

Ich habe eine Demo erstellt, damit Sie verstehen können. Jede Hilfe wäre toll!

http://jsfiddle.net/gxRC9/4/

body{
    margin:0px;
    padding:0px;
}
.clear{
    clear:both;
}
.container{
    height:2000px;
}
.cover-photo-container{
width:700px;
height: 348px;
margin-bottom: 20px;
background-color:red;
}

.small-box{
    width:163px;
    height:100px;
    border:1px solid blue;
    float:left;
}

.sticky-header{
    width:700px;
    height:50px;
    background:orange;
    postion:fixed;
}

Antworten auf die Frage(10)

Ihre Antwort auf die Frage