toggle နည်းလမ်း
toggle နည်းလမ်းသည် အချက်များ၏ ညင်သာစွာ ပြသခြင်း/ဝှက်ထားခြင်းကို
အလှည့်ကျ ပြုလုပ်ပေးသည်။ အကယ်၍ အချက်တစ်ခုကို ပြသထားပါက ၎င်းကို ဝှက်ထားမည်
ပြီး ပြောင်းပြန်လည်း ဖြစ်မည်။
ဝါကျဖွဲ့ပုံ
မီလီစက္ကန့်ဖြင့် သတ်မှတ်ထားသော အချိန်အတွင်း ပြသခြင်း၊
မူလအားဖြင့် 400ms ဖြစ်သည်။
.toggle(ကြာချိန်);
အချိန်ကို မီလီစက္ကန့်ဖြင့်သာမက
သော့ချက်စကားလုံးများ slow (600ms)
နှင့် fast (200ms) ဖြင့်လည်း သတ်မှတ်နိုင်သည်။
တန်ဖိုးများလေလေ၊ အရုပ်လှုပ်ရှားမှုနှေးလေလေ ဖြစ်သည်။
.toggle('slow' သို့မဟုတ် 'fast');
display ပါရာမီတာဖြင့် true သို့မဟုတ် false
တန်ဖိုးကို လွှဲပြောင်းပေးနိုင်သည်။ အကယ်၍ true ဖြစ်ပါက အချက်သည်
ပြသရန်သာ ဖြစ်မည်။ false ဖြစ်ပါက ဝှက်ထားမည်။
.toggle(display);
ပါရာမီတာများကို မသတ်မှတ်ပါက - အရုပ်လှုပ်ရှားမှု မရှိဘဲ၊ အချက်များသည် ချက်ချင်း ပြသခြင်း/ဝှက်ထားခြင်း ဖြစ်မည်။
.toggle();
ဒုတိယပါရာမီတာအဖြစ် ချောမွေ့ရေးလုပ်ဆောင်ချက်ကိုလည်း လွှဲပြောင်းပေးနိုင်သည်၊ ထို့ပြင် တတိယပါရာမီတာအဖြစ် callback-လုပ်ဆောင်ချက် - အရုပ်လှုပ်ရှားမှု ပြီးစီးပြီးနောက် အလုပ်လုပ်မည်။ ပါရာမီတာနှစ်ခုလုံးသည် မဖြစ်မနေလိုအပ်ခြင်း မရှိပါ။
.toggle(ကြာချိန်, [ချောမွေ့ရေး လုပ်ဆောင်ချက်], [callback-လုပ်ဆောင်ချက်]);
ဒုတိယ မဖြစ်မနေလိုအပ်ခြင်းမရှိသော ပါရာမီတာအဖြစ် callback-လုပ်ဆောင်ချက်ကို လွှဲပြောင်းပေးနိုင်သည် - အရုပ်လှုပ်ရှားမှု ပြီးစီးပြီးနောက် အလုပ်လုပ်မည်။
.toggle(ကြာချိန်, [callback-လုပ်ဆောင်ချက်]);
key: value စုံတွဲများ ပါဝင်သည့် JavaScript object ပုံစံဖြင့် မတူညီသော ရွေးချယ်စရာများကို နည်းလမ်းသို့ လွှဲပြောင်းပေးနိုင်သည်။
.toggle(options);
ထိုကဲ့သို့သော object သည် အောက်ပါ
ပါရာမီတာများနှင့် လုပ်ဆောင်ချက်များကို လွှဲပြောင်းပေးနိုင်သည် - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. ဤပါရာမီတာများ၏
ဖော်ပြချက်ကို သင် နည်းလမ်း
animate အတွက် ကြည့်ရှုနိုင်သည်။ ဥပမာအားဖြင့်၊
ကြာချိန်နှင့် ချောမွေ့ရေးလုပ်ဆောင်ချက်ကို သတ်မှတ်မည်။
.toggle( {duration: 800, easing: easeInSine} );
ဥပမာ
ခလုတ်ကို နှိပ်ပြီးနောက်၊ toggle နည်းလမ်းကို အသုံးပြု၍
ဝှက်ထားသော စာပိုဒ်ကို ညင်သာစွာ ပြသကြပါစို့။
သော့ချက်စကားလုံး slow ကို လွှဲပြောင်းခြင်းဖြင့်၊ အမြန်နှုန်းကို
600ms သတ်မှတ်မည်။ ထပ်မံနှိပ်ပါက - ဝှက်မည်။
<button>စာသားကို ပြပါ</button>
<p style="display: none">စာသား</p>
$('button').click(function() {
$('p').toggle('slow');
});
ဤအရာကိုလည်း ကြည့်ပါ
-
fadeToggleနည်းလမ်း,
အချက်များ၏ ဖော်ပြမှုကို ပြောင်းလဲပေးသည့် နည်းလမ်း -
slideToggleနည်းလမ်း,
အချက်များ၏ ညင်သာစွာ ပြသခြင်း/ဝှက်ထားခြင်းကို အလှည့်ကျ ပြုလုပ်သည့် နည်းလမ်း -
showနည်းလမ်း,
အချက်များကို ညင်သာစွာ ပြသသည့် နည်းလမ်း -
hideနည်းလမ်း,
အချက်များကို ညင်သာစွာ ဝှက်ထားသည့် နည်းလမ်း