fadeTo method

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

ဖွဲ့စည်းပုံ

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

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

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

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

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

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

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

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

ဥပမာ

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

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

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

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

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

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

fadeToggle method,
သည် အစိတ်အပိုင်းများ၏ အလင်းပေါ့မှုကို ပြောင်းလဲပေးသည်
fadeIn method,
သည် ဝှက်ထားသော element များကို ဖြေးဖြေးချင်းပြသကာ အလင်းပေါ့မှုမရှိအောင်ပြုလုပ်ပေးသည်
animate method,
သည် element များ၏ ဂုဏ်သတ္တိများကို animate လုပ်ပေးသည်