A css metódus
A css metódus lehetővé teszi elemek
CSS stílusainak lekérését és módosítását.
Fontos megjegyezni, hogy a 'számított értékeket'
kaptuk meg (computed style
properties), amelyek eltérhetnek a
css stílusokban megadottaktól.
Szintaxis
Egy tulajdonság lekérése:
$(selector).css(tulajdonság);
Több tulajdonság lekérése, az átadott paraméter egy tulajdonságnevek tömbje:
$(selector).css(['width', 'height', 'color']);
Egy tulajdonság módosítása:
$(selector).css(tulajdonság, új érték);
Módosítsunk több tulajdonságot úgy, hogy objektum formájában adjuk át őket,
amely 'kulcs: érték' párokat tartalmaz. A tulajdonság neve
CamelCase formában van megadva:
$(selector).css({fontSize: '12px', color: 'red'});
Vagy, alternatív megoldás:
<p class="www">szöveg</p>
$('.www').css({'font-size':'12px', 'color':'red'});
Egy adott függvényt alkalmazhatunk minden
elemre a halmazban. Ekkor a függvény első paraméterként megkapja
az elem sorszámát a halmazban, a második paraméterként
pedig az adott css tulajdonság aktuális értékét
az adott elemre vonatkozóan. Ekkor a this
a függvényen belül az aktuális elemre mutat.
Minden egyes elem CSS tulajdonsága azon értékre
változik, amelyet a függvény az adott elemre visszaad:
$(selector).css(tulajdonságnév, function(sorszám a halmazban, css tulajdonság aktuális értéke));
Példa
Vegyük az összes www osztállyal rendelkező elemet,
és változtassuk meg a színüket pirosra:
<p class="www">szöveg</p>
$('.www').css('color', 'red');
Példa
Vegyük az összes www osztállyal rendelkező elemet,
és változtassuk meg a színüket pirosra, a betűméretet
pedig 20px-re:
<p class="www">szöveg</p>
$('.www').css({color:'red', fontSize:'20px'});
Vagy, alternatív megoldás:
<p class="www">szöveg</p>
$('.www').css({'color':'red', 'font-size':'20px'});
