CSS animation အခြေခံ

  • အရှေ့စားစား all
  • နောက်ပိုင်းစား animation-delay

ဒီပုံစံ နှင့် အသုံးပြုခြင်း

animation အခြား အခြေအနေ မပြောဆိုဘဲ အပိုင်းအခြား အချိန် 0 ဖြစ်လ� အနောက်တိုက် မပြောင်းလဲပါ:

အစီရင်ခံ:လုံးဝ အုပ်ချုပ်ပေးသင်: ကိုယ်စားပြုခြင်း ကို ချိတ်ဆက်သော အသုံးပြုသော အခြေအနေ ကို အသိအမှတ်ပြုသည်။ အခြား အခြေအနေ မပြောဆိုဘဲ အပိုင်းအခြား အချိန် 0 ဖြစ်လာရာ အနောက်တိုက် မပြောင်းလဲပါ:

အခြား ကြည့်ရန်:

CSS3 ပြည်ထောင်စု:စက်ဆုံး အစားထိုး

HTML DOM ကိုယ်စားပြုမှု စာရင်းသား:animation 属性

实例

使用简写属性，将动画与 div 元素绑定：

div
{
animation:mymove 5s infinite;
}

亲自试一试

CSS 语法

animation: name duration timing-function delay iteration-count direction;
အချက် အချက်
ဖော်ပြ animation-name
ကိုယ်စားပြုခြင်း ကို ချိတ်ဆက်သော အသုံးပြုသော အခြေအနေ ကို အသိအမှတ်ပြုသည်။ animation-duration
အလုပ် အပြီး အချိန် ကို အသိအမှတ်ပြုသည်။ animation-timing-function
animation-delay အလုပ် စတင် ပြီးချိန် အချိန် ကို အသိအမှတ်ပြုသည်။
animation-iteration-count အလုပ် အပြန်ပြန် အသုံးပြုသည် သို့မဟုတ် အသုံးပြုသည် ကို အသိအမှတ်ပြုသည်။
animation-direction အလုပ် အပြန်ပြန် အသုံးပြုသည် သို့မဟုတ် မပြန်ပြန် အသုံးပြုသည် ကို အသိအမှတ်ပြုသည်။
animation-fill-mode အလုပ် အချိန်အပြား အစိတ်အပိုင်း အသုံးပြုသော အခြေအနေ ကို အသိအမှတ်ပြုသည်။
animation-play-state အလုပ်သည် ပြုများသည် သို့မဟုတ် ခုံရှိသည် ကို အသိအမှတ်ပြုသည်။

နည်းပါး

မူကြမ်း none 0 ease 0 1 normal
ကြိုးတင်ခြင်း no
ပုံစံ CSS3
JavaScript အကျဉ်းချုပ် object.style.animation="mymove 5s infinite"

ဘတ်ယား အကူအညီ

အခြေအနေ အရာဝတ္တု အမှတ် သည် အစိတ်အပိုင်း ကို ပြုလုပ်သော အသစ်ပေါ်မူကွဲ သော အသစ်ပေါ်မူကွဲ အခြေအနေ ကို အသိအမှတ်ပြုသည်။

အစိတ်အပိုင်း -webkit-、-moz- သို့မဟုတ် -o- ဖြင့် အသုံးပြုသော စက္ခနှ် သည် အသုံးပြုသော အသစ်ပေါ်မူကွဲသည်။

Chrome IE / Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
43.0
4.0 -webkit-		 10.0 16.0
5.0 -moz-		 9.0
4.0 -webkit-		 30.0
15.0 -webkit-
12.0 -o-
  • အရှေ့စားစား all
  • နောက်ပိုင်းစား animation-delay