Metoden css
Metoden css lar deg hente
og endre CSS-stiler til et element.
Det er viktig å huske at vi vil få 'beregnede
verdier' for egenskapene (computed style
properties), som kan avvike fra
de som er spesifisert i CSS-stilene.
Syntaks
Hent en enkelt egenskap:
$(selector).css(egenskap);
Hent flere egenskaper, parameteren som sendes er en array med egenskapsnavn:
$(selector).css(['width', 'height', 'color']);
Endre en enkelt egenskap:
$(selector).css(egenskap, ny verdi);
La oss endre flere egenskaper ved å sende dem som et objekt
som inneholder par med 'nøkkel: verdi'. Egenskapens navn
angis i CamelCase:
$(selector).css({fontSize: '12px', color: 'red'});
Eller, et alternativt alternativ:
<p class="www">tekst</p>
$('.www').css({'font-size':'12px', 'color':'red'});
Vi kan også bruke en gitt funksjon på hvert
element i settet. I dette tilfellet vil funksjonen
motta indeksen til elementet i settet som første parameter, og den andre parameteren
vil være gjeldende verdi for den angitte css-egenskapen
for det spesifikke elementet. this
innenfor funksjonen vil peke på det gjeldende elementet.
CSS-egenskapen til hvert element vil endres til den
som funksjonen returnerer for nettopp det elementet:
$(selector).css(egenskapsnavn, function(indeks i settet, gjeldende verdi for css-egenskap));
Eksempel
La oss hente alle elementer med klassen www
og endre fargen deres til rød:
<p class="www">tekst</p>
$('.www').css('color', 'red');
Eksempel
La oss hente alle elementer med klassen www
og endre fargen deres til rød, og skriftstørrelsen
til 20px:
<p class="www">tekst</p>
$('.www').css({color:'red', fontSize:'20px'});
Eller, et alternativt alternativ:
<p class="www">tekst</p>
$('.www').css({'color':'red', 'font-size':'20px'});