[lolerele2011]

JO,

Bin neu in der "Homepage-zone" ich bin seit ein paar tagen an einer homepage dran.
Hab eigentlich alles recht gut gemeistert, bloss beim Befehl fokus happerts.
Also:
ich will: Das wenn ich in der Navigation oben, wenn ich klicke(z.B. Home) das dann bei diesem block ein background-image kommt.
und nicht das dieses image dann immer bleibt wie beim "visited". sondern wenn man dann den nächsten Link anklick, das background-image wieder wie am anfang ausssieht.

Die Bilder sind unwichtig, stellt euch einfach vor normal sieht ein Blöckchen der navigation(news) grün aus, wenn ich drüber fahr rot, und wenn ichs angeklickt habe blau.
wenn ich dann das nächste blöckchen(Über uns) anklicke ist das blau und das vorherige wieder grün (wie am anfang)

Ich dachte das macht man mit focus bin mir aber nicht sicher.

wäre nett wenn ihr helfen könntet

Gruss

lolerle

HTML:

<ul id="navi">
<li><a href="index.html">Home</a></li>
<li><a href="agogik.html">Agogik</a></li>
<li><a href="Betriebe.html">Betriebe</a></li>
<li><a href="Finanzen.html">Finanzen</a></li>
<li><a href="Gesundheit_Medizin.html">Gesundheit &amp; Medizin</a></li>
<li><a href="Human_Resources.html">Human Resources</a></li>
</ul>

CSS:

ul#navi {
list-style-type: none;
width: 818px;
float: left;
font-family: Verdana ,Arial,sans-serif;
font-size: 12px;
font-weight: bold;
margin: 0;
padding: 10px 0 0 0;
background:#E5FDB0;
border-right:2px solid #A0CB26;
}

ul#navi li {
display: block;
float:left;
margin: 0 0 0 4px;

}

ul#navi li a {
display: block;
padding: 5px 26px;
color: #fff;
background-image: url(tabg2.png);
text-decoration: none;*/
}

ul#navi li.active a,
ul#navi li a:focus,
ul#navi li a:hover{
background-image: url(tabg5.png);
color: #A0CB26;
border-right:2px solid #A0CB26;
}

[maet]

Deinem Html fehlt jeweils auf jeder Seite noch die Information, welche Seite aktiv ist, z.B so in der index.html:

<ul id="navi">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="agogik.html">Agogik</a></li>
<li><a href="Betriebe.html">Betriebe</a></li>
<li><a href="Finanzen.html">Finanzen</a></li>
<li><a href="Gesundheit_Medizin.html">Gesundheit &amp; Medizin</a></li>
<li><a href="Human_Resources.html">Human Resources</a></li>
</ul>

[lolerele2011]

Zitat von maet

Deinem Html fehlt jeweils auf jeder Seite noch die Information, welche Seite aktiv ist, z.B so in der index.html:

<ul id="navi">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="agogik.html">Agogik</a></li>
<li><a href="Betriebe.html">Betriebe</a></li>
<li><a href="Finanzen.html">Finanzen</a></li>
<li><a href="Gesundheit_Medizin.html">Gesundheit &amp; Medizin</a></li>
<li><a href="Human_Resources.html">Human Resources</a></li>
</ul>

Danke, habs eingebaut.

Habs jetzt kapiert, wie das funktioniert.

[CLOSED]

[hubspe]

Zitat von lolerele2011

Danke, habs eingebaut.
Habs jetzt kapiert, wie das funktioniert.
[CLOSED]

Halt!!
Die gepostete Lösung war leider nicht so ganz optimal, weil der Deppenlink stehenbleibt.
In der CSS-FAQ wird ab Punkt 10 alle möglichen Arten von navis erklärt.

[maet]

Berechtigter Einwand, sorry.