Dynamiczne zmiana stylów (cała klasa CSS) Drukuj
Ocena użytkowników: / 1
SłabyŚwietny 
Wpisany przez Patryk yarpo Jar   
wtorek, 22 września 2009 17:19

Zdarza się, że chcemy przebudować wygląd jakiegoś elementu na stronie w odpowiedzi na pewne działania usera. Można wtedy zmieniać pojedyncze atrybuty CSS, jednak czy nie lepiej jest przypisać całą klasę?

Oto kod w "czystej" Javie Script:

 function zmien_klase_CSS(nazwa_nowej_klasy, element) { 

    var el = document.getElementById(element);

    el.className = nazwa_nowej_klasy;

} 

A w kodzie HTML należy to wywołać mniej - więcej tak:

 
<p>To jest przykładowy napis</p>

<p><a href="javascript:zmien_klase_CSS('nowa','napis')">Zmień klasę</a></p> 

Przydałby się jeszcze przykładowy kod CSS:

 .stara {

    font: normal 1em arial, sans-serif;

}

.nowa {

    font: bold 2em verdana, sans-serif;

} 

Po złożeniu tego w jedną stronę, wszystko powinno działać jak należy.