CSS: Pseudoklasse :hover funktioniert nicht mehr

[freakgesicht]

Hallo Forum!

Ich habe bisher einen Rollovereffekt mittels CSS verwendet - also folgendes Muster:

a.class_link:link, a.class_link:visited
{
  background: url('nichtaktiv.jpg');
}

a.class_link:hover
{
  background: url('aktiv.jpg');
}

D.h. also wenn man nicht mit der Mouse über dem Link stand, bestand der Link aus der Grafik "nichtaktiv.jpg" und wenn man drüber fährt, wechselte das Bild auf "aktiv.jpg".

Nun wollte ich, dass sobald man auf einen Link geklickt hat (ich habe mehrere verschiedene Links (natürlich dafür auch pro Link Grafiken für aktiv und nicht-aktiv), dieser in der Aktiv-Position bleibt. Dafür weise ich dann diesem angeklicken Button bei einem Klick darauf per jQuery die CSS-Eigenschaft background: url('aktiv.jpg'); zu. Gleichzeig erhalten alle anderen Buttons, also alle, die nicht angeklickt wurden, die CSS-Eigenschaft background: url('nichtaktiv.jpg'); zu.

Zwar funktioniert das, jedoch funktioniert der Rollover-Effekt nun nicht mehr

Ich habe es auch probiert, die Pseudoklassen direkt anzusprechen und ihnen die Eigenschaften für link, visited und hover zuzuweisen:

$('a.class_link:link').css([siehe Eigenschaft oben]);
$('a.class_link:visited').css([siehe Eigenschaft oben]);
$('a.class_link:hover').css([siehe Eigenschaft oben]);

Leider ist dies auch nicht erfolgreich... Hat jemand eine Idee, wie ich meine Idee umsetzen kann, dass der Rollover-Effekt bleibt und trotzdem jener Button im Aktiv-Zustand verbleibt, der gerade angeklickt wurde?

Sollte meine Frage unklar formuliert sein, bitte einfach kurz sagen, dass das so ist, dann erkläre ich's genauer!

Danke!

[Quetschi]

Verpasse dem aktiven Link per jQuery eine CSS-Klasse, die z.B. 'active' heißt.

Im CSS weißt du dann dieser Klasse die gleichen Eigenschaften für den Hintergrund zu, wie der hover-pseudoklasse.