Style animation အကိုးအချုပ်
- အဆင်းပြင် alignSelf
- နောက်ပိုင်း စားသုံး animationDelay
- အဆင်းတက် HTML DOM Style အရာဝတ္တု
ဒီအကိုးအချုပ်၏ သတင်းများ နှင့် အသုံးပြုခြင်း
animation
အကိုးအချုပ် သည် နှစ်ပုံး အနောက်တန်းလှုပ်ရှားခြင်း အကိုးအချုပ် ခွဲခြားထားသည်:
- ဖော်ပြ
- အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။
- အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။
- animationDelay
- animationIterationCount
- animationDirection
ဖော်ပြ:အချက်ပြခြင်းကို အပြည့်အဝင် ပြုပြီ animationDuration အကိုးအချုပ်အခြားမူကား အချိန်ရှိသော အစားအလာ 0 ဖြစ်ပြီး အခြားအချိန်မပြောင်းပါ။
အကြောင်းကြောင်း
လုပ်ငန်းကို ကိုယ်စားပြုခြင်း အသုံးပြုပြီး <div> အစိတ်အပိုင်း၏ အနောက်တန်းလှုပ်ရှားခြင်းကို ပြောင်းလဲပြုပြင်ပါ:
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";
အပြောအဆ
animation အခြေအနေ ကို ပြန်လည်ပေးပါ။
object.style.animation
animation အခြေအနေ ကို သတ်မှတ်ပါ။
object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"
"
အခြေအနေ | အတိုင်း |
---|---|
ဖော်ပြ | animationName |
အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။ | animationDuration |
အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။ | animationTimingFunction |
animationDelay | အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။ |
animationIterationCount | အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။ |
animationDirection | အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။ |
animationFillMode | အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေ ကို သတ်မှတ်သည်။ |
animationPlayState | အသံတူးတူး သို့မဟုတ် ပိတ်ခဲ့သည့် အခြေအနေကို သတ်မှတ်သည်။ |
initial | အခြေအနေ ကို မူးယစ်အခြေအနေ သို့ ပြန်လည်သုံးပြီး ပြီ။ ကျမ်းကို ကြည့်ပါ။ initial. |
inherit | အဖွဲ့အစည်းမှ ထို အခြေအနေ ကို သုံးပြီး ပြီးပြီ။ ကျမ်းကို ကြည့်ပါ။ inherit. |
နည်းပါးဆိုင်ရာ
မူးယစ်အခြေအနေ: | none 0 ease 0 1 normal none running |
---|---|
ကွာန်းမှု | ကို ကိုးကွယ်သော animation အခြေအနေ. |
CSS အမျိုးအစား: | CSS3 |
ဘရာဇီဂီ ထောက်ပံ့
animation
ဖြစ်သည်် CSS3 (1999) အခြေအနေဖြစ်သည်။
အားလုံး ဘရာဇီဂီ ကို အပြည့်အဝင် ထောက်ပံ့သည်:
Chrome | Edge | Firefox | Safari | Opera | IE |
---|---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera | IE |
ထောက်ပံ့ | ထောက်ပံ့ | ထောက်ပံ့ | ထောက်ပံ့ | ထောက်ပံ့ | 11 |
ပတ်သက်သော စားသုံး
CSS စာရင်းလုံးanimation အခြေအနေ
- အဆင်းပြင် alignSelf
- နောက်ပိုင်း စားသုံး animationDelay
- အဆင်းတက် HTML DOM Style အရာဝတ္တု