Metoda toggleClass

Metoda toggleClass alternează adăugarea/eliminarea unei clase CSS: dacă nu există - o va adăuga, dacă există - o va elimina.

Sintaxă

O singură clasă CSS:

javascript$(selector).toggleClass(numele clasei);

Doar adaugă sau elimină o clasă CSS în funcție de al doilea parametru, care acceptă valori true sau false:

javascript$(selector).toggleClass(numele clasei CSS, stare);

Mai multe clase CSS:

javascript$(selector).toggleClass(['clasa1', 'clasa2', 'clasa3', '...']);

Doar adaugă sau elimină clasele CSS în funcție de al doilea parametru:

javascript$(selector).toggleClass(['clasa1', 'clasa2', 'clasa3', '...'], stare');

Aplicarea unei funcții pentru fiecare element din set, starea poate fi true sau false, și indică metodei - doar să adauge sau doar să elimine clasa CSS:

javascript$(selector).toggleClass(function(număr în set, clasele curente ale elementului, stare), [stare]);

Exemplu

Paragraful nostru are deja două clase. Să-i adaugăm și clasa www:

html<p id="test" class="eee ggg">text</p>

javascript$('#test').toggleClass('www');

Codul HTML va arăta astfel:

html<p id="test" class="eee ggg www">text</p>

Exemplu

Și acum clasa www există deja în element - să o eliminăm:

html<p id="test" class="eee ggg www">text</p>

javascript$('#test').toggleClass('www');

Codul HTML va arăta astfel:

html<p id="test" class="eee ggg">text</p>

Vedeți și