Metoda css
Metoda css permite obținerea
și modificarea stilurilor CSS ale elementului.
Este important să rețineți că vom obține 'valorile
calculate' ale proprietăților (computed style
properties), care pot diferi de cele
specificate în stilurile CSS.
Sintaxă
Obține o singură proprietate:
$(selector).css(proprietate);
Obține mai multe proprietăți, parametrul transmis - un array cu numele proprietăților:
$(selector).css(['width', 'height', 'color']);
Modifică o singură proprietate:
$(selector).css(proprietate, valoare nouă);
Modifică mai multe proprietăți, transmitându-le sub forma unui obiect
care conține perechi 'cheie: valoare'. Numele proprietății
se specifică sub forma CamelCase:
$(selector).css({fontSize: '12px', color: 'red'});
Sau, o alternativă:
<p class="www">text</p>
$('.www').css({'font-size':'12px', 'color':'red'});
De asemenea, putem aplica o funcție dată fiecărui
element din set. În acest caz, primul parametru al funcției
va primi indexul elementului în set, iar al doilea parametru
- valoarea curentă a proprietății CSS specificate
pentru elementul concret. În acest caz, this
în interiorul funcției va indica elementul curent.
Proprietatea CSS a fiecărui element se va schimba în
valoarea returnată de funcție pentru acel element concret:
$(selector).css(nume proprietate, function(index în set, valoare curentă a proprietății css));
Exemplu
Hai să obținem toate elementele cu clasa www
și să le schimbăm culoarea în roșu:
<p class="www">text</p>
$('.www').css('color', 'red');
Exemplu
Hai să obținem toate elementele cu clasa www
și să le schimbăm culoarea în roșu, iar dimensiunea fontului
- la 20px:
<p class="www">text</p>
$('.www').css({color:'red', fontSize:'20px'});
Sau, o alternativă:
<p class="www">text</p>
$('.www').css({'color':'red', 'font-size':'20px'});