Metode css
Metode css ļauj iegūt
un mainīt elementa CSS stilus.
Svarīgi atcerēties, ka mēs iegūsim 'aprēķinātās
vērtības' īpašībām (computed style
properties), kas var atšķirties no
norādītajām css stilos.
Sintakse
Iegūt vienu īpašību:
$(selektors).css(īpašība);
Iegūt vairākas īpašības, padodamais parametrs - īpašību nosaukumu masīvs:
$(selektors).css(['width', 'height', 'color']);
Mainīt vienu īpašību:
$(selektors).css(īpašība, jaunā vērtība);
Mainīsim vairākas īpašības, padodot tās objekta veidā,
saturētājam atslēgu: vērtību pārus. Īpašības nosaukums
tiek norādīts CamelCase formātā:
$(selektors).css({fontSize: '12px', color: 'red'});
Vai, alternatīvs variants:
<p class="www">text</p>
$('.www').css({'font-size':'12px', 'color':'red'});
Mēs arī varam piemērot noteiktu funkciju katram
elementam komplektā. Šajā gadījumā pirmais parametrs funkcijai
tiks iegūts elementa numurs komplektā, bet otrais parametrs
- pašreizējā norādītās css īpašības vērtība
konkrētajam elementam. Šajā gadījumā this
funkcijas iekšpusē norādīs uz pašreizējo elementu.
Katras elementa CSS īpašība tiks mainīta uz to,
ko funkcija atgriezīs konkrētajam elementam:
$(selektors).css(īpašības nosaukums, function(numurs komplektā, pašreizējā css īpašības vērtība));
Piemērs
Iegūstam visus elementus ar klasi www
un mainām to krāsu uz sarkanu:
<p class="www">text</p>
$('.www').css('color', 'red');
Piemērs
Iegūstam visus elementus ar klasi www
un mainām to krāsu uz sarkanu, bet fonta izmēru
- uz 20px:
<p class="www">text</p>
$('.www').css({color:'red', fontSize:'20px'});
Vai, alternatīvs variants:
<p class="www">text</p>
$('.www').css({'color':'red', 'font-size':'20px'});