[CSS] Mouseover bij hyperlinks icm JS

[Verwijderd]

Volgende is het probleem.
In mijn website waar ik de standaard hyperlinks in CSS opgemaakt heb zonder hiervoor een aparte class te gebruiken, wil ik dat aan enkele bepaalde hyperlinks een class gehangen wordt, zodat ik deze d.m.v. een javascript in één keer aan kan passen (door het drukken op een knopje).

Standaard hyperlink CSS
a {color: #ffffff;font-size:10px;text-decoration: none;}
a:visited {color: #ffffff;font-size:10px;text-decoration: none;}
a:hover {color: #555555;font-size:10px;text-decoration: none;}
a:active {color: #555555;font-size:10px;text-decoration: none;}

2 classes:

a.tabs_inact {color: #123456; text-decoration: none; }
a.tabs_inact:hover {color: #123456; text-decoration: none; }

a.tabs_act {color: #6543210; text-decoration: none; font-weight:bold;}
a.tabs_act:hover {color: #6543210; text-decoration: none; }

(kleuren ff verzonnen, bestaan vast niet)

<a href="test.php" class="tabs_inact">Test</a>

Als ik nu echter de class aan een hyperlink koppel, blijft de hyperlink er uitzien als de hyperlink zonder class, totdat ik de algemene hyperlink uit de CSS verwijder. Schijnbaar overheerst die algemene hyperlink opmaak, en moet ik iedere hyperlink nu een class mee gaan geven. Dit is echter niet mogelijk.....

Ik hoop dat hier een oplossing voor is, maar ik kan er niets over vinden.

[Sappie]

zijn de CSS selectors zoals je ze hierboven gepost hebt hetzelfde als de CSS selectors die je écht gebruikt? Zo nee, dan heeft het vast wat te maken met specificity.

Zo ja.. dan weet ik het ook niet... een class in je selector geeft deze een hogere specificity en zou dus boven de selector zonder class moeten gaan.

[Verwijderd]

Verwijderd schreef op woensdag 24 augustus 2005 @ 15:57:
Volgende is het probleem.
In mijn website waar ik de standaard hyperlinks in CSS opgemaakt heb zonder hiervoor een aparte class te gebruiken, wil ik dat aan enkele bepaalde hyperlinks een class gehangen wordt, zodat ik deze d.m.v. een javascript in één keer aan kan passen (door het drukken op een knopje).

Standaard hyperlink CSS
a {color: #ffffff;font-size:10px;text-decoration: none;}
a:visited {color: #ffffff;font-size:10px;text-decoration: none;}
a:hover {color: #555555;font-size:10px;text-decoration: none;}
a:active {color: #555555;font-size:10px;text-decoration: none;}

2 classes:

a.tabs_inact {color: #123456; text-decoration: none; }
a.tabs_inact:hover {color: #123456; text-decoration: none; }

a.tabs_act {color: #6543210; text-decoration: none; font-weight:bold;}
a.tabs_act:hover {color: #6543210; text-decoration: none; }

(kleuren ff verzonnen, bestaan vast niet)

<a href="test.php" class="tabs_inact">Test</a>

Als ik nu echter de class aan een hyperlink koppel, blijft de hyperlink er uitzien als de hyperlink zonder class, totdat ik de algemene hyperlink uit de CSS verwijder. Schijnbaar overheerst die algemene hyperlink opmaak, en moet ik iedere hyperlink nu een class mee gaan geven. Dit is echter niet mogelijk.....

Ik hoop dat hier een oplossing voor is, maar ik kan er niets over vinden.

Je wilt dus via JS in één keer de opmaak van een aantal hyperlinks aanpassen?

[Verwijderd]

De exacte bedoeling is een tabbladen systeem waarvan de hyperlink in de geselecteerde tab een andere css opmaak moet krijgen dan een andere tab. Dit hele concept werkt allemaal prima, totdat ik de de algemene hyperlink (zonder class) in de CSS zet, dan gaan alle hyperlinks er zo uit zien.

Sappie: Ja, de selectors zijn van toepassing op de hyperlink waar de class aan gekoppeld is.

[cowgirl]

Komt het niet doordat de links met classes geen :visited en :active hebben. Volgens mij wordt daardoor teruggevallen naar de standaard :visited en :active.

[Sappie]

Ik denk dat cowgirl deels gelijk heeft en dat ik er met mijn stomme kop overheen gekeken heb

de pseudo classes geven een selector een hogere specificity dan de class selectors en overriden deze dus. Echter heb je geen gebruik gemaakt van de :link pseudo class, die een unvisited link aangeeft. Waarschijnlijk staat dus nog in de cache dat ze reeds 'gevisit' zijn en wordt daardoor dus de :visited pseudo class 'aangewend'.

[ Voor 18% gewijzigd door Sappie op 24-08-2005 16:30 ]

[Verwijderd]

Verwijderd schreef op woensdag 24 augustus 2005 @ 16:20:
De exacte bedoeling is een tabbladen systeem waarvan de hyperlink in de geselecteerde tab een andere css opmaak moet krijgen dan een andere tab. Dit hele concept werkt allemaal prima, totdat ik de de algemene hyperlink (zonder class) in de CSS zet, dan gaan alle hyperlinks er zo uit zien.

Sappie: Ja, de selectors zijn van toepassing op de hyperlink waar de class aan gekoppeld is.

Kijk hier eens: http://www.w3schools.com/css/css_pseudo_classes.asp.

[ Voor 4% gewijzigd door Verwijderd op 24-08-2005 16:31 ]

[Verwijderd]

cowgirl: Thanks, dat was hem

Dom van me