1
2
3
4
5
6
7
8
9
10
11
<div id="navi">
    <?php
    echo '<ul>' . "\n";
    echo "\t" . '<li '; if ((!isset($_GET['cont']) || $_GET['cont'] == 'm1')) { echo ' id="current"'; } echo '><a href="?cont=m1">Menue 1</a></li>' . "\n";
    echo "\t" . '<li '; if ((isset($_GET['cont']) && $_GET['cont'] == 'm2')) { echo ' id="current"'; } echo '><a href="?cont=m2">Menue 2</a></li>' . "\n";
    echo "\t" . '<li '; if ((isset($_GET['cont']) && $_GET['cont'] == 'm3')) { echo ' id="current"'; } echo '><a href="?cont=m3">Menue 3</a></li>' . "\n";
    echo "\t" . '<li '; if ((isset($_GET['cont']) && $_GET['cont'] == 'm4')) { echo ' id="current"'; } echo '><a href="?cont=m4">Menue 4</a></li>' . "\n";
    echo "\t" . '<li '; if ((isset($_GET['cont']) && $_GET['cont'] == 'm5')) { echo ' id="current"'; } echo '><a href="?cont=m5">Menue 5</a></li>' . "\n";
    echo '' . "\n";
    ?>
</div>

Hierbei wird einfach nur überprüft, ob $_GET[‚cont‘] gesetzt ist, und mit welchem Wert. Dieser wird dann mit dem Wert im Link verglichen und dementsprechend wird der Menüpunkt dann markiert.

Nun noch das dazugehörige CSS:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!--
*   Reitermenue mittels CSS und PHP
*
*   (c) by Helmut-Peter Pfeufer
-->

<!--
#############################
##          CSS            ##
#############################
-->
<style>
#navi {
    float: left;
    width: 100%;
    background: #DAE0D2 url("images/bg.gif") repeat-x bottom;
    font-size: 93%;
    line-height: normal;
    text-align: center;
}

#navi ul {
    margin: 0;
    padding: 0px 0px 0px 0px;
    list-style: none;
}

#navi li {
    float: left;
    background: url("images/left.gif") no-repeat left top;
    margin: 0;
    padding: 0px 0px 0px 9px;
}

#navi a {
    float: left;
    display: block;
    background: url("images/right.gif") no-repeat right top;
    padding: 5px 15px 4px 6px;
    text-decoration: none;
    font-weight: bold;
    color: #776655;
}

/* Commented Backslash Hack
   hides rule from IE5-Mac \\*/

#navi a {
    float: none;
}

/* End IE5-Mac hack */
#navi a:hover {
    color: #333333;
}

#navi #current {
    background-image: url("images/left_on.gif");
}

#navi #current a {
    background-image: url("images/right_on.gif");
    color: #333333;
    padding-bottom: 5px;
}
</style>

Schreibe einen Kommentar

Ihre Email-Adresse wird nicht veröffentlicht. Pflichtfelder sind durch * markiert.

Sie können folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>