✔ CSS-Class-Umschalter

[megapreisbrecher]

Hallo,

ich such nun schon seit Stunden vergeblich nach einem Code, mit dem ich die Klasse eines Link hin und her schalten kann. Immer wieder finde ich nur den Code wie ich eine Klasse ändere, aber nicht wie ich es rückgängig mache?

So sieht mein Link aus.

<a href="javascript:;" onclick="change()" class="active"><img src="icon.gif"></a>

Ich würde gerne bei Klick auf den Link die Klasse nach "passive" ändern. Bei erneutem Klick wieder auf "active".

Kann mir jemand helfen wie das geht?

 

[Gumbo]

Such mal nach „addClassName“ und „removeClassName“.

 

[Sven Mintel]

onclick="this.className=(this.className=='active')?'passive':'active';"

 

[megapreisbrecher]

Cool, das klappt. Ich habe es aber in einer externen js-Datei weil ich noch etwas mit dem Link machen will, daher die Funktion "change".

Leider klappt es in der externen Datei nicht:

function change() {
 this.className=(this.className=='active')?'passive':'active';
}

 

[Sven Mintel]

Machs dann so:

...
function change(obj)
{
 obj.className=(obj.className=='active')?'passive':'active';
}
...


onlick="change(this)"

Per "this" übergibst du da auslösende Objekt ...also in dem Fall den Link, auf den man klickt.


Die Anweisung prüft in der Funktion den klassennamem...ist er "active", wird er auf "passive" gesetzt...andernfalls auf "active"...ist somit nur eine kürzere Screibweise für eine simple if/else-Bedingung, gleichbedeutend mit:

if(obj.className=='active')  {obj.className='passive';}
else{obj.className='active';}

 

[megapreisbrecher]

Viele Dadnk, klappt sehr gut.