CSS | Fixed meny

[rdan87]

Hei,

 

Jeg har et problem...

 

Jeg skal ha en meny som er festet til toppen. Men den skal bare feste seg der når du scroller forbi den... Det får jeg ikke til, det går liksom bare ikke an å endre "position" til "fixed" istedet for "relative", da forsvinner hele menyen...

 

Her er nettsiden,

http://demo.conatu.net/mediebyraet/

 

CSS koden for menyen:

#wrapper {
position: absolute;
float: right;
right: 0;
top: 100%;
height: 55px;
width: 80%;
}
#menubar {
position: relative;
width: 100%;
top: -25%;
height: 55px;
background: #330f47;
}
#menubar nav {
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
height: 55px;
width: 95%;
max-width: 850px;
left: 50%;
margin-left: -425px;
}
#menubar nav ul {
list-style: none;
text-align: center;
text-transform: uppercase;
font-size: 14px;
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
width: 100%;
height: 100%;
}
#menubar nav ul li {
float: left;
display: block;
background: #330f47;
vertical-align: middle;
max-width: 30%;
height: 55px;
position: relative;
margin-left: auto;
margin-right: auto;
padding-top: 21px;
}
#menubar nav ul li a {
color: #FFF;
text-decoration: none;
background: url('../images/light-overlay.png') repeat;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-position: center;
padding-left: 30px;
padding-right: 30px;
height: 14px;
padding-top: 21px;
padding-bottom: 21px;
}
#menubar nav ul li a:hover {
color: #FFF;
text-decoration: none;
background: url('../images/dark-overlay.png') repeat;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-position: center;
}
#menubar nav ul li:hover {
background: #FFF;
}
#menubar nav ul li:active {
background: #FFF;
}

 

Vet ikke helt åssen jeg skal forklare det bedre, håper alle forstår...

[Toolshed]

Har ikke lest hele innlegget ditt men søkte dette kjapt opp og fant denne siden, vil råde deg sjekke den ut.

Men på #wrapper ville jeg skriv:

#wrapper{ top:0px; right:0px; position:fixed; [OSV] }

Ingenting er testet.

Endret 25. juli 2013 av Pushit

[Gjest]

Er det dette du vil oppnå?

I så fall må du se på jQuery i tillegg.

[rdan87]

Er det dette du vil oppnå?

I så fall må du se på jQuery i tillegg.

 

Ja det er det jeg vil oppnå, men det trengs slettes ikke jQuery...