fadeTo method

fadeTo method သည် element ၏ အလင်းပေါ့မှု ကို သတ်မှတ်ထားသည့်တန်ဖိုးအထိ၊ 0 မှ 1 အထိအတွင်း၌ ဖြေးဖြေးချင်းပြောင်းလဲပေးသည်။

ဖွဲ့စည်းပုံ

method ကိုမည်သို့အသုံးပြုသည်ဖြစ်စေ ကြာချိန်နှင့် အလင်းပေါ့မှုတန်ဖိုးကို သတ်မှတ်ရမည်။ သတ်မှတ်ထားသောအချိန်အတွင်း အလင်းပေါ့မှုကို ပြောင်းလဲခြင်း၊ မူလအားဖြင့် 400ms ဖြစ်သည်။

javascript.fadeTo(ကြာချိန်, အလင်းပေါ့မှုတန်ဖိုး);

အချိန်ကို milliseconds ဖြင့်သာမက slow (600ms) နှင့် fast (200ms) ဟူသော သော့ချက်စကားလုံးများဖြင့်လည်း သတ်မှတ်နိုင်သည်၊ တန်ဖိုးကြီးလေလေ animation နှေးလေလေဖြစ်သည်။

javascript.fadeTo('slow' သို့မဟုတ် 'fast', အလင်းပေါ့မှုတန်ဖိုး);

တတိယမြောက် (မသတ်မှတ်လည်းရသော) parameter အဖြစ် callback function ကိုလည်းပေးပို့နိုင်သည် - animation ပြီးဆုံးပြီးနောက် အလုပ်လုပ်မည်။

javascript.fadeTo(ကြာချိန်, အလင်းပေါ့မှုတန်ဖိုး, [callback function]);

ချောမွေ့မှုပေးသည့် function နှင့် callback function ကိုလည်း (မသတ်မှတ်လည်းရသော parameter များ) ပေးပို့နိုင်သည် - animation ပြီးဆုံးပြီးနောက် အလုပ်လုပ်မည်။

javascript.fadeTo(ကြာချိန်, အလင်းပေါ့မှုတန်ဖိုး, [ချောမွေ့မှုပေးသည့် function], [callback function]);

ဥပမာ

အောက်ပါဥပမာတွင်၊ fadeTo method ကို အသုံးပြု၍ #hide button ကိုနှိပ်လိုက်သောအခါ #test element ၏ အလင်းပေါ့မှုကို 0.5 အထိ လျှော့ချကာ ဝှက်ထားမည်၊ #show button တွင် ပြသမည်။

html<button id="hide">ဝှက်မည်</button>
<button id="show">ပြမည်</button>
<div id="test"></div>

css#test {
  width: 200px;
  height: 200px;
  background: green;
  color: white;
  margin-top: 10px;
}

javascript$('#show').on('click', function() {
  $('#test').fadeTo(1000, 1);
});

$('#hide').on('click', function() {
  $('#test').fadeTo(1000, 0.5);
});

ဤသည်ကိုလည်းကြည့်ပါ