Metode css
Metode css memungkinkan untuk mendapatkan
dan mengubah gaya CSS elemen.
Penting untuk diingat bahwa kita akan mendapatkan 'nilai
yang dihitung' dari properti (computed style
properties), yang mungkin berbeda dari
yang ditentukan dalam gaya css.
Sintaks
Mendapatkan satu properti:
$(selektor).css(properti);
Mendapatkan beberapa properti, parameter yang diteruskan - array nama properti:
$(selektor).css(['width', 'height', 'color']);
Mengubah satu properti:
$(selektor).css(properti, nilai baru);
Mari ubah beberapa properti, dengan meneruskannya dalam bentuk objek,
yang berisi pasangan 'kunci: nilai'. Nama properti
ditentukan dalam bentuk CamelCase:
$(selektor).css({fontSize: '12px', color: 'red'});
Atau, alternatifnya:
<p class="www">teks</p>
$('.www').css({'font-size':'12px', 'color':'red'});
Kita juga dapat menerapkan fungsi yang ditentukan ke setiap
elemen dalam kumpulan. Dalam hal ini, parameter pertama fungsi
akan menerima nomor elemen dalam kumpulan, dan parameter kedua
- nilai saat ini dari properti css yang ditentukan
untuk elemen tertentu. Perlu diperhatikan bahwa this
di dalam fungsi akan menunjuk ke elemen saat ini.
Properti CSS setiap elemen akan berubah menjadi nilai
yang dikembalikan oleh fungsi untuk elemen tersebut:
$(selektor).css(nama properti, function(nomor dalam kumpulan, nilai saat ini properti css));
Contoh
Mari kita ambil semua elemen dengan kelas www
dan ubah warnanya menjadi merah:
<p class="www">teks</p>
$('.www').css('color', 'red');
Contoh
Mari kita ambil semua elemen dengan kelas www
dan ubah warnanya menjadi merah, dan ukuran fontnya
- menjadi 20px:
<p class="www">teks</p>
$('.www').css({color:'red', fontSize:'20px'});
Atau, alternatifnya:
<p class="www">teks</p>
$('.www').css({'color':'red', 'font-size':'20px'});
