XHTMLforum - Hover Effekt soll auch andere Class ändern

XHTMLforum (http://xhtmlforum.de/index.php)

- CSS (http://xhtmlforum.de/forumdisplay.php?f=73)

- - Hover Effekt soll auch andere Class ändern (http://xhtmlforum.de/showthread.php?t=41609)

Hover Effekt soll auch andere Class ändern

Joa, mein Problem betrifft meine Navigationsleiste. Is alles sehr schlicht gehalten, einfache Wortlinks, die beim Mouseover die Schriftfarbe (in weiss) ändern. So, ist ein Bereich angewählt wird der entsprechende Link farblich geändert (in weiss). Geht man nun auf einen anderen Bereich nimmt dieser durch Hover die Farbe weiss an, aber, es soll nun die Farbe des aktullen Bereiches (die class heisst aktuell) sich in die normale Linkfarbe der Navigation ändern...

Es soll also beim Hover sich auch eine andere Class ändern...Ist dies irgendwie zu erreichen?

Hab hier und bei Google Tage gesucht, aber hab auch keinen Plan wie ich die Suche ausdrücken soll*g*

Dank im vorraus :)

Ich hätte da eine Idee, würde aber gerne erst dein HTML sehen.

Also, is alles schlicht gehalten, hier der Quelltextausschnitt:

Code:

<div id="navi"><!--Beginn Navicontainer-->

<a href="news.html" class="aktuell">News</a> | <a href="lineup.html" class="navi">Line Up</a> | <a href="dates.html" class="navi">Termine</a> | <a href="e_loc.html" class="navi">Eintritt &amp; Location</a> | <a href="impr.html" class="navi">Impressionen</a> | <a href="kontakt.html" class="navi">Kontakt</a>

</div><!--Ende Navicontainer-->

Und hier der passende CSS-Ausschnitt:

Code:

/* Navicontainer */

div#navi

{

  float:left;

  width:429px;

  margin:0%;

  height:18px;

  background-image: url("navi.png");

  color:#FF0000;

  font-size:9px;

  font-weight:bold;

  font-family:tahoma;

  line-height:18px;

}

a.navi:link, a.navi:visited, a.navi:active, a.navi:hover, a.aktuell

{

 color:#BEB9A9;

 font-size:9px;

 text-decoration:none;

 font-family:tahoma;

 font-weight:bold;

 margin-right:3px;

 margin-left:3px;

 line-height:18px;

}

/* Hovereffekt Links */

a.navi:active, a.navi:hover

{

 color:#FFFFFF;

}

/* aktueller Link */

a.aktuell

{

 color:#FFFFFF;

}/* Ende Links im Navicontainer */

Hallo,

Du kannst das, was Du willst, zumindest mit JavaScript erreichen, in dem Du dem aktuellen Link eine id (z. B. id="beispiel") zuweist, und diesem Element dann per Javascript bei onMouseOver

Code:

document.getElementById("beispiel").style.color = "#BEB9A9";

eines anderen Navipunktes eine andere Farbe gibst.

Wüßte jetzt leider nicht, dass sowas auch ohne JS möglich ist..

Gruß Lona

Danke, das wär ne Idee! :)

Ich setz mich mal ran, nach der Bandprobe*g*
An sich is JS nich so wild, wenn es nen Besucher aus hat, dann fehlt der kleine Effekt halt...nich so wild...

Falsch. Ich meide JS wie der Teufel das Weihwasser.

Erstens solltest du aus der Navi eine Liste machen. Dann brauchst du nur noch die Farbe des gewünschten Links (oder des Listenpunktes) ändern, wenn die Liste gehovert wird:

ul:hover li.current{}

Siehe hier: http://css.maxdesign.com.au/index.htm