Rollover menu maken

Gestart doorErik8 reacties83 weergaven

9 berichten · pagina 1 van 1

Erik

Lid · Topicstarter

Berichten
7.109
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Hey,
Ik vroeg me iets af.
Hoe maak je rollover menu? Dus zon menu die uitklapt.
0
Berichten
1.160
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Google Search:

Css:

#nav, #nav ul {
padding: 3px 0 0 0;
margin: 0;
list-style: none;
}

#nav li {
float: left;
width: 120px;
}

#nav ul {
position: absolute;
width: 120px;
left: -1000px;
}

#nav li:hover ul, #nav li.ie_does_hover ul {
left: auto;
background-position: 0 0;
}

#nav a {
display: block;
margin: 2px 5px 3px 5px;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
}

ul a{
font-weight: bold;
color: #F60;
cursor: default;
}

ul ul a:link, ul ul a:visited{
font-weight: normal;
color: #CCC;
cursor: pointer;
}

ul ul a:hover, ul ul a:active{
font-weight: normal;
color: #FFF;
cursor: pointer;
}

ul li{
background-color: #CCC;
border-left: 3px solid #FFF;
}

ul ul li{
background-color: #666;
border-top: 3px solid #FFF;
border-left: 0;
}

/* IE only hack */
* html ul li, * html ul ul li{
border-bottom: 3px solid #FFF;
}

* html ul ul li{
border-top: 0;
}
/* Einde IE only hack */


HTML:

<ul id="nav">

<li><a href="#">Main item 1</a>

<ul>
<li><a href="#">Sub item 1.1</a></li>
<li><a href="#">Sub item 1.2</a></li>
<li><a href="#">Sub item 1.3</a></li>
<li><a href="#">Sub item 1.4</a></li>
</ul>

</li>

<li><a href="#">Main item 2</a>

<ul>
<li><a href="#">Sub item 2.1</a></li>
<li><a href="#">Sub item 2.2</a></li>
<li><a href="#">Sub item 2.3</a></li>
<li><a href="#">Sub item 2.4</a></li>
<li><a href="#">Sub item 2.5</a></li>
</ul>

</li>

<li><a href="#">Main item 3</a>

<ul>
<li><a href="#">Sub item 3.1</a></li>
<li><a href="#">Sub item 3.2</a></li>
</ul>

</li>

</ul>


Resultaat:Drop Down Menu

Bron: Sceneone.nl
0
Berichten
2.950
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Dat kan niet in IE6 werken geloof ik
0
Erik

Lid · Topicstarter

Berichten
7.109
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
En, ik wil hem zelf maken. yummiePS. Weet iemand het probleem van mijn inloggen? Dankje.
0
Berichten
1.160
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Je hebt iig een voorbeeld,
misschien kan je wat afkijken en zelf iets maken.
0
Berichten
2.950
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Ik zou hem niet zelf maken als ik jou was hoor, het is veel simpeler om er eentje te rippen
0
Erik

Lid · Topicstarter

Berichten
7.109
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Dat wel. Maar ik wil er ook van leren...
Maar weet iemand het login probleem?
0
Berichten
4.749
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
@Erik is dat niet een andere topic ?
Ps dat leren kan van een tut.
0
Erik

Lid · Topicstarter

Berichten
7.109
Reputatie
0
Punten
0,00
Lid sinds
Laatst gezien
Ja.
0

Jouw reactie

Deel je idee, stel een vraag of help een ander verder.

Editor laden…

Praat mee met de One2xs-community.

Inloggen om te reageren