Metodas css
Metodas css leidžia gauti
ir pakeisti elemento CSS stilius.
Svarbu atsiminti, kad mes gausime 'apskaičiuotas
reikšmes' savybių (computed style
properties), kurios gali skirtis nuo
nurodytų CSS stiliuose.
Sintaksė
Gauti vieną savybę:
$(selektorius).css(savybė);
Gauti kelias savybes, perduodamas parametras - savybių pavadinimų masyvas:
$(selektorius).css(['width', 'height', 'color']);
Pakeisti vieną savybę:
$(selektorius).css(savybė, nauja reikšmė);
Pakeiskime kelias savybes, perduodant jas kaip objektą,
kuriame yra poros 'raktas: reikšmė'. Savybės pavadinimas
nurodomas CamelCase formatu:
$(selektorius).css({fontSize: '12px', color: 'red'});
Arba, alternatyvus variantas:
<p class="www">tekstas</p>
$('.www').css({'font-size':'12px', 'color':'red'});
Taip pat galime pritaikyti nurodytą funkciją kiekvienam
elementui rinkinyje. Tuo pačiu metu pirmuoju parametru funkcija
gaus elemento numerį rinkinyje, o antruoju parametru
- dabartinę nurodytos CSS savybės reikšmę
konkretiam elementui. Tuo pačiu metu this
funkcijos viduje rodys į dabartinį elementą.
Kiekvieno elemento CSS savybė pasikeis į tą,
kurią funkcija grąžins konkrečiai šiam elementui:
$(selektorius).css(savybės pavadinimas, function(numeris rinkinyje, dabartinė CSS savybės reikšmė));
Pavyzdys
Gaukime visus elementus su klase www
ir pakeiskime jų spalvą į raudoną:
<p class="www">tekstas</p>
$('.www').css('color', 'red');
Pavyzdys
Gaukime visus elementus su klase www
ir pakeiskime jų spalvą į raudoną, o šrifto dydį
- į 20px:
<p class="www">tekstas</p>
$('.www').css({color:'red', fontSize:'20px'});
Arba, alternatyvus variantas:
<p class="www">tekstas</p>
$('.www').css({'color':'red', 'font-size':'20px'});