menu balk als tab bladen

Status
Niet open voor verdere reacties.

arienlans

Gebruiker
Lid geworden
15 aug 2008
Berichten
172
is het mogelijk om in css "ul#navigatie li a:active" aktief te houden als deze pagina bekijkt waardoor je kan zien op welk tabblad je zit.

HTML:
/* navigatie - niveau 1 */
ul#navigatie {padding:0px 15px; width:636px; height:20px; display:block; float:left; }
ul#navigatie li { position:relative; height:20px; display:block; float:left; width: 90px;}
ul#navigatie li a { font-weight:bold; color:#fff; padding:0px 10px; display:block; background-image:url(../images/naktief.PNG)}
ul#navigatie li:hover a,
ul#navigatie li a:hover { color:#FFFFFF; background-image:url(../images/haktief.PNG) }
ul#navigatie li a:active  {color:#FF0000; background-image:url(../images/aktief.PNG) }
/* navigatie - niveau 2 */
ul#navigatie li ul { position:absolute; top:20px; display:none; width:90px; z-index:2; }
ul#navigatie li:hover ul { display:block; }
ul#navigatie li ul li { clear:both; height:auto; width:100%; }
ul#navigatie li:hover ul li a,
ul#navigatie li ul li a { background:#efefef none; padding:10px; width:90px; display:block; color:#bbb; font-weight:normal; }
ul#navigatie li ul li:hover a,
ul#navigatie li ul li a:hover { background:#bbb none; color:#fff; font-style:Comic Sans MS; }
/* navigatie - niveau 3 */
ul#navigatie li:hover ul li ul,
ul#navigatie li ul li ul { position:absolute; top:0; left:110px; display:none; background:#090 none; z-index:3; }
ul#navigatie li ul li:hover ul { display:block; }
ul#navigatie li ul li ul li { }
ul#navigatie li ul li:hover ul li a,
ul#navigatie li ul li ul li a { font-style:normal; }
ul#navigatie li ul li ul li:hover a,
ul#navigatie li ul li ul li a:hover { background:#efefef none; color:#bbb; font-style:Comic Sans MS;}
/* navigatie - niveau 4 */
ul#navigatie li:hover ul li ul li ul,
ul#navigatie li ul li ul li ul { position:absolute; top:0; left:110px; display:none; background:#090 none; z-index:3; }
ul#navigatie li ul li ul li:hover ul { display:block; }
ul#navigatie li ul li ul li ul li { }
ul#navigatie li ul li ul li:hover ul li a,
ul#navigatie li ul li ul li ul li a { font-style:normal; }
ul#navigatie li ul li ul li ul li:hover a,
ul#navigatie li ul li ul li ul li a:hover { background:#bbb none; color:#fff; }
* html ul li, * html ul ul li{
border-bottom: 3px solid #FFF; 
}
 
Dat kun je doen door op elke pagina het menu-item van die pagina de class active te geven.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan