hover deaktivieren
 

Hallo zusammen,

ich hab per js programmiert, daß mein aktives Menüelement in grün dargestellt wird. Somit kann man sehen, auf welcher Seite man sich aktuell befindet. (Grünes Bild ist im css unter selected definiert).

Problem, da ich auch eine Farbe für hover festgelegt hab (grau), wird so lange das graue Menüelement angezeigt, bis ich nach dem Klick das Menüelement verlassen habe.

Wie kann ich also Hover für das aktive Element deaktivieren, damit es nach dem Klick grün ist und ggf. auch nicht anzuklicken ist, da ja bereits aktiv.

Hier mal der Code aus js:

$('#menu-items li a').click(function(e) {
$('#menu-items li a').removeClass('selected');
$(this).addClass('selected');
});


Danke für die Hilfe

Dafür brauchst Du kein JavaScript. Das kannst Du auch per CSS regeln indem Du für den Fall, dass das selected-Element gehovert wird diesem eigene Eigenschaften vergibst.

Hab es geschafft mit .selected:hover

Jetzt hab ich nur noch das Problem, daß mein erster Button in grün erscheinen soll, wenn die Homepage geladen wurde. Denn die Startseite ist ja zu Beginn schon aktiv.

Hast dazu auch ne Lösung?

Das musst du dir selber programmieren.

Sag mal du gibst hier auch nur kluge Sprüche ab, oder?
Mir ist schon klar, daß ich das selber machen darf. Nur fehlt mir die Idee, wie ich es umsetzen kann und Google hat mir bis jetzt noch nicht die Antwort geliefert.

Deshalb schreib ich auch ins Forum, in der Hoffnung fachlich qualifizierte Antworten zu erhalten.

Nein, ich helfe hier seit vielen Jahren und tausenden von Beiträgen. Aber Helfen kann man nur, wenn der Fragende auch entsprechende formuliert.

Dann schrebe auch qualifizierte Fragen. Wir können dir nicht helfen, wenn du uns irgendwelche Bruchstücke hinwirfst.

In deinem Fall wissen wir so gut wie gar nichts, ausser dass du CSS benutzt.

Die Frage ist: wieso wird das menü nicht entsprechend geändert auf der jeweiligen Seite?
Dann könntest du über geändertes markup (span statt anker), oder über eine klasse immer herausfinden was aktiv ist.

So, damit ihr genau nachvollziehen könnt was mein Problem ist, hier erst mal der Link zu der betroffenen Seite.

Ihr befindet euch jetzt auf der Hauptseite "Dienstleistungen". Darunter seht ihr die 5 Bilder, welche ein eigenes Submenü darstellen. Klickt ihr z.B. auf das zweite Bild, wird es grün und der Text unten ändert sich. Klickt ihr eins weiter, wird das nächste Bild grün und das davor geht in den Ursprungszustand zurück. So sieht man, wo man sich gerade befindet.

Mein Problem, wenn ich die Seite "Dienstleistungen" öffne, ist ja zu beginn der Text des ganz linken Bildes schon aktiv. Daher sollte auch gleich das ganz linke Bild grün sein.

Nur hab ich keinen Plan, wie ich das schaffe.

Schon mal vielen Dank für die Hilfe

Das ist jetzt aber kein hover-Effekt um den es geht. Was du willst erreichst Du wenn Du beim Laden der seite den Home-Link mit der Klasse selected versiehst. Dann wird das auch beim Laden dieser Seite grün dargestellt.

Also müsste ich in js einen onload Befehl schreiben. Oder würdest du es in css machen? Wie sähe der Befehl dazu in etwa aus?