Komplizierter Hover-Effekt funktioniert nicht

[Sn0opy]

Narf, blödes Topic...

Geht um folgendes. Ich habe eine Navigation, die momentan komplett auf Grafiken basiert. Da ein Hovereffekt mit Grafiken in manchen Browsern echt mies ist, weil die Bilder zu lange laden müssen, wollte ich auf CSS umsteigen.

Aufbau der Navi funktionierte so weit und ein Teil des Hovers auch schon.

test

Wenn man über die graue Schrift beim ersten Punkt geht, soll die schwarze Schrift darunter pink werden. Das funktioniert einwandfrei und auch dauerhaft. Wenn man nun die Seite neu lädt und das selbe nochmal ausschließlich mit dem schwarzen Text macht, funktioniert es auch problemlos. -> Die schwarze Schrift wird pink.

Nun kommt das eigentliche Problem. Wenn ich die Maus über den grauen Text lege, wird der schwarze Text ja pink. Gehe ich direkt danach über den schwarzen Text passiert nicht mehr. Der schwarze Text bleibt schwarz, obwohl er pink werden sollte.


Hierbei bitte den 2. Navibutton nicht verwenden, dort hatte ich was anderes getestet. Es geht nur um den 1.

 

[yoshi95]

Also bei mir funktioniert alles einwandfrei...

Hover Grau: Schwarz wird zu pink
Hover Schwarz: Schwarz wird zu pink
Auch beim drüberfahren ist alles korrekt, glaub ich...

 

[Sn0opy]

Ja, JETZT Hab auch nen paar Stunden dran gesessen um das zu fixen. Das Blöde daran ist eben, dass nun alles Javascript ist.

 

[mi-schi]

Was ist daran so schwierig:
Ineinander verschachteln und via CSS so ansprechen:

a:hover span { color:purple; }

 

[Sn0opy]

Was ist daran so schwierig:
Ineinander verschachteln und via CSS so ansprechen:

a:hover span { color:purple; }

So hatte ich es auch, aber nachdem man dann über den grauen Text geganegn ist, funktionierte der Hovereffekt nicht mehr, wenn man über das schwarze ging, OBWOHL es mit ziemlicher Sicherheit richtig war. Ich denke, dass ich es so nun lassen werde.

 

[yoshi95]

Leute, die JS deaktivieren, werden auch auf anderen seiten keine große Dynamik erreichen...

 

[sysop]

wenn du die fehlerhafte seite nicht im link stehen lässt, kann man sich den fehler nicht ansehen.
thema scheint also gefixed zu sein....

 

[Sn0opy]

So sah es vorher aus:

Fehlerhafte Navigation

 

[ingoS]

Liebe Güte...
Klassischer Fall von "Warum einfach, wenns auch kompliziert geht?":mrgreen:
Guck mal hier: Nicht mehr fehlerhafte Navigation
Der Code ist wesentlich einfacher und ich kann weder im Firefox noch im Internet Explorer einen Fehler feststellen - und du brauchst kein JavaScript.;Jump

 

[Sn0opy]

Omg, das ist mir heute schon mehrfach passiert, allerdings eher in Sachen PHP. Nach ner Stunde hatte ich statt 17 Zeilen Code nur noch 4...

Vielen Dank dafür :)