ကာတွန်း စတင်ဖြစ်ရပ်
ဥပမာ
CSS animation စတင်သောအခါတွင် <div> ဒြပ်စင်တစ်ခုဖြင့် တစ်ခုခုလုပ်ပါ-
var x = document.getElementById("myDIV");
// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationStart", myStartFunction);
// Standard syntax
x.addEventListener("animationstart", myStartFunction);
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
CSS ကာတွန်းရုပ်ပြကို စတင်ဖွင့်သောအခါတွင် လှုပ်ရှားသက်ဝင်မှုစတင်သည့်ဖြစ်ရပ် ဖြစ်ပေါ်သည်။
CSS အန်နီမေးရှင်းများအကြောင်း နောက်ထပ်အချက်အလက်များအတွက်၊ CSS3 Animations ဆိုင်ရာ ကျွန်ုပ်တို့၏ သင်ခန်းစာကို ကြည့်ပါ ။
CSS ကာတွန်းတစ်ခု ဖွင့်သောအခါတွင် ဖြစ်ပွားနိုင်သည့် အဖြစ်အပျက် သုံးခုရှိသည်။
- animationstart - CSS animation စတင်သောအခါတွင် ဖြစ်ပေါ်သည်။
- animationiteration - CSS ကာတွန်းကို ထပ်ခါတလဲလဲ ပြုလုပ်သောအခါ ဖြစ်ပေါ်သည်။
- animationend - CSS animation ပြီးသွားသောအခါတွင် ဖြစ်ပေါ်သည်။
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် အဖြစ်အပျက်ကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးပါသည်။
"webkit" သို့မဟုတ် "moz" ဖြင့် လိုက်သော နံပါတ်များသည် ရှေ့ဆက်တစ်ခုနှင့် လုပ်ဆောင်သည့် ပထမဆုံးဗားရှင်းကို သတ်မှတ်ပေးပါသည်။
Event | |||||
---|---|---|---|---|---|
animationstart | 4.0 webkit | 10.0 | 16.0 5.0 moz |
4.0 webkit | 15.0 webkit 12.1 |
မှတ်ချက်- Chrome၊ Safari နှင့် Opera အတွက်၊ webkitAnimationStart ရှေ့စာလုံးကို အသုံးပြုပါ။
အထားအသို
object.addEventListener("webkitAnimationStart", myScript); // Code for Chrome, Safari and Opera
object.addEventListener("animationstart", myScript); // Standard syntax
မှတ်ချက်- addEventListener () နည်းလမ်းကို Internet Explorer 8 နှင့် အစောပိုင်းဗားရှင်းများတွင် ပံ့ပိုးမထားပါ။
နည်းပညာဆိုင်ရာအသေးစိတ်
ပူဖောင်း: | ဟုတ်ကဲ့ |
---|---|
ပယ်ဖျက်နိုင်သည်- | မရှိ |
ပွဲအမျိုးအစား- | အန်နီမေးရှင်းဖြစ်ရပ် |
DOM ဗားရှင်း- | အဆင့် 3 ပွဲများ |
ဆက်စပ်စာမျက်နှာများ
CSS ကျူတိုရီရယ်- CSS3 အန်နီမေးရှင်း
CSS ရည်ညွှန်းချက်- CSS3 ကာတွန်းပစ္စည်း ပိုင်ဆိုင်မှု
HTML DOM ရည်ညွှန်း- စတိုင်ကာတွန်း ပိုင်ဆိုင်မှု