Ich muss noch mal ran.
Ich habe eine dynamische Navigationsleiste (eine Liste), die folgendes erfüllen soll:
1. Die Startseite soll als "Home" bezeichnet werden (funktioniert auch, aber eventuell ist der Code Schuld an den Anzeige-Problemen).
2. Alle Seiten werden in der Navigation über ein Rollover angesprochen
2. Jedesmal, wenn man auf einer Seite angelangt ist, soll diese in der Navigation statisch sein (das habe ich versucht, indem ich eine Definition für .current_page_item angelegt habe).
Was nicht klappt:
a. Das CSS spricht die Startseite nicht an, d.h. das Hintergrundbild wird nicht angezeigt.
b: Die Angaben für .current_page_item werden ignoriert.
Ich wäre mächtig dankbar für jede Hilfe.
Hier der Code für das Menu:
<div id="menu">
<ul>
<li><a href="<?php echo get_option('home'); ?>/">Home</a></li>
<?php wp_list_pages('title_li='); ?>
</ul>
</div>
Hier der Code für das CSS (verkürzt), der Punkt .current_page_item ist ganz unten:
#menu {
float: left;
z-index: 0;
position: absolute;
margin-left: 250px;
top: 90px;
}
#menu ul {
padding: 0;
white-space: nowrap;
margin: 0;
}
#menu ul li {
padding: 0;
display: block;
float: left;
text-align: center;
background: none no-repeat 10px 15px;
}
#menu ul li a {
color: #fff;
background-color: transparent;
text-decoration: none;
display: block;
border-style: none;
}
#menu ul li a:link, #menu ul li a:visited {
background-image: url(images/orange.gif);
background-repeat: no-repeat;
height: 26px;
width: 94px;
line-height: 26px;
padding-top: 7px;
}
#menu ul>li+li a:link, #menu ul>li+li a:visited {
background-image: url(images/gruen.gif);
background-repeat: no-repeat;
height: 26px;
width: 94px;
line-height: 26px;
padding-top: 7px;
}
...
#menu ul li a:hover, #menu ul li a:active {
background-image: url(images/orange.gif);
background-repeat: no-repeat;
background-position: 0px -66px;
height: 29px;
width: 94px;
line-height: 29px;
padding-top: 4px;
}
#menu ul>li+li a:hover, #menu ul>li+li a:active {
background-image: url(images/gruen.gif);
background-repeat: no-repeat;
background-position: 0px -66px;
height: 29px;
width: 94px;
line-height: 29px;
padding-top: 4px;
}
...
/* Unverändertes Format für gerade aktive Seite */
.current_page_item a:link, .current_page_item a:visited, .current_page_item a:hover, .current_page_item a:active {
background-image: url(images/blau.gif);
background-repeat: no-repeat;
background-position: 0px -66px;
height: 29px;
width: 94px;
line-height: 29px;
padding-top: 4px;
}
#menuclear {
clear: both;
}
Alles anzeigen