Higlight aktiver Navigationspunkt mit include

[kkc2003]

Hallo, auf meiner Seite wird die Navigation mittels include gesetzt. Nun möchte ich aber, dass immer der aktuell aktive Navipunkt hervorgehoben bleibt undnicht nur bei mouse over aufblinkt. So ist immer nur der Index-link aktiv.

Ich habe schon diverse Anleitungen versucht, bin aber selber mit PHP überfordert. Vielleicht kann mir hier jemand sagen, wie der Code umgebaut werden muss, damit das passt. Vorab vielen Dank!

<div id="header">
      <a href="#"><img src="images/logo.png" alt="Test" /></a>
            <ul id="navi">
        <li class="first"><a href="index.php" class="active">Designer</a></li>
        <li><a href="#">Bestellung</a></li>
        <li><a href="adt.php">Angebote</a></li>
        <li><a href="kontakt.php">Kontakt</a></li>
      </ul>
	</div>

 

[KingNothing]

Wie sieht denn die entsprechende CSS-Datei aus?
Den jeweils aktiven Menüpunkt mußt Du natürlivh mit PHP ermitteln und dann die
CSS-Styles auf die Menüpunkte setzen.

 

[kkc2003]

Die CSS sieht so aus

/* header & navi -------------- */

#header {
	position: relative;
	margin-bottom: 10px;
}

#header .cart {
    position: absolute;
    top: 20px;
    right: 10px;
    padding-left: 35px;
    background: url(images/cart_icn.gif) top left no-repeat;
    background-position: 0 2px;
    font-size: 10px;
}

#header .cart p {
    padding: 0;
}

#header ul#navi {
	float: left;
    clear: both;
    width: 1000px;
    background: url(images/navi_bg.png) top left no-repeat;
    color: #fff;
    font-size: 13px;
    height: 37px;
	padding: 0 0 20px 0;  
}

#header ul#navi li {
    float: left;
    text-align: center;
    margin: 2px 0;
}

#header ul#navi li a {
	color: #fff;
	margin: 1px 0;
	padding: 6px 11px 8px 11px;
	border-right: 1px solid #0B0B0B;
	display: block;
}

#header ul#navi li a.active,
#header ul#navi li a:hover
{
    background: url(images/active.png) top left no-repeat;
}

#header ul#navi li.first a.active,
#header ul#navi li.first a:hover
{
    background: url(images/active_first.png) top left no-repeat;
}

 

[Maik]

Hi,

diese Frage wurde erst vor drei Tagen in dem Thread class="hover" frage erörtert.

mfg Maik

 

[KingNothing]

Da hat er Recht!
Lies Dir das Thema mal durch und nutze den vorgeschlagenen Link dort.
Das sollte Dir helfen.

 

[Maik]

Da hat er Recht!
Lies Dir das Thema mal durch und nutze den vorgeschlagenen Link dort.
Das sollte Dir helfen.

Das sollte nicht nur, sondern wird helfen

mfg Maik