css method
css method သည် element ၏ CSS စတိုင်များကို
ရယူခြင်းနှင့် ပြောင်းလဲခြင်းကို ခွင့်ပြုပါသည်။
သတိပြုရမည့်အချက်မှာ ကျွန်ုပ်တို့ရရှိမည့်အရာသည် 'တွက်ချက်ထားသော
တန်ဖိုးများ' (computed style
properties) ဖြစ်ပြီး ၎င်းတို့သည် CSS စတိုင်များတွင်
သတ်မှတ်ထားသောတန်ဖိုးများနှင့် ကွဲပြားနိုင်သည်။
Syntax
property တစ်ခုကို ရယူခြင်း:
$(selector).css(property);
property အများအပြားကို ရယူခြင်း၊ ပေးပို့သော parameter သည် property အမည်များ၏ array ဖြစ်သည်:
$(selector).css(['width', 'height', 'color']);
property တစ်ခုကို ပြောင်းလဲခြင်း:
$(selector).css(property, new value);
object တစ်ခုအဖြစ် ပေးပို့ခြင်းဖြင့် property အများအပြားကို ပြောင်းလဲပါမည်။
property အမည်ကို CamelCase ပုံစံဖြင့် ဖော်ပြရပါမည်။
$(selector).css({fontSize: '12px', color: 'red'});
သို့မဟုတ်၊ အခြားရွေးချယ်စရာ:
<p class="www">text</p>
$('.www').css({'font-size':'12px', 'color':'red'});
ကျွန်ုပ်တို့သည် သတ်မှတ်ထားသော function တစ်ခုကို set ရှိ element တစ်ခုစီအတွက် အသုံးပြုနိုင်ပါသည်။
ဤသို့ပြုလုပ်သောအခါ function ၏ ပထမ parameter သည် set အတွင်းရှိ element ၏ အစဉ်လိုက်နံပါတ်ကို ရရှိပြီး
ဒုတိယ parameter သည် ၎င်းတိကျသော element အတွက် သတ်မှတ်ထားသော css property ၏ လက်ရှိတန်ဖိုးဖြစ်သည်။
ဤသို့ဖြင့် function အတွင်းရှိ this သည် လက်ရှိ element ကို ညွှန်ပြပါလိမ့်မည်။
Element တစ်ခုစီ၏ CSS property သည် function မှ ထို element အတွက် ပြန်ပေးသော တန်ဖိုးသို့ ပြောင်းလဲသွားပါမည်:
$(selector).css(property name, function(index in set, current css property value));
ဥပမာ
class www ရှိသော element အားလုံးကို ရယူကာ
၎င်းတို့၏ အရောင်ကို အနီရောင်သို့ ပြောင်းလဲကြပါစို့:
<p class="www">text</p>
$('.www').css('color', 'red');
ဥပမာ
class www ရှိသော element အားလုံးကို ရယူကာ
၎င်းတို့၏ အရောင်ကို အနီရောင်သို့ ပြောင်းလဲပြီး
font အရွယ်အစားကို 20px သို့ ပြောင်းလဲကြပါစို့:
<p class="www">text</p>
$('.www').css({color:'red', fontSize:'20px'});
သို့မဟုတ်၊ အခြားရွေးချယ်စရာ:
<p class="www">text</p>
$('.www').css({'color':'red', 'font-size':'20px'});