Style transition အခွင့်
- အရှေ့စာ transformStyle
- နောက်ပိုင်းစာ transitionProperty
- အဆင်းတက်ခြင်း ပြန် HTML DOM Style အရာဝတ္တု
ဖော်ပြ နှင့် အသုံးပြုခြင်း
transition အခွင့် ကို လုံးဝ ပါဝင်သော အခွင့် အတွက်
စကားလုံး:အချိန် ကို အပြီးအပေါ် ကျပြုပါ transitionDuration အခွင့်အခြား အချိန် မပြောင်းလဲ လျှင် ကျသတင်း မရှိသေးဘူး၊ ကျသတင်း မလုံလောက်ပါ။
အခြား ကြည့်ချင်သည်များ:
CSS ဆိုင်ရာ ကျမ်းကို ကြည့်ပါ:transition အခွင့်
အကျိုးသက်
div အဆိုပါ အရာတွင် မိုးစကား ခုံးကြည့် ပြီး အမှုန်း ဖြင့် ပြောင်းလဲလိမ့်မည်:
document.getElementById("myDIV").style.transition = "all 2s";
အပြောအဆို
transition အခွင့် နိုင်ငံခြား သတင်း
object.style.transition
transition အခွင့် ကျပြုပါ:
object.style.transition = "property duration timing-function delay|initial|inherit"
အခွင့် အရေးပါ အချက်
| အခွင့် | ဖော်ပြ |
|---|---|
| transitionProperty | ကျသတင်း ပြောင်းလဲ ပြုလုပ် သည့် ဘာသာစကား အခွင့် |
| transitionDuration | ကျသတင်း ပြောင်းလဲ အချိန် |
| transitionTimingFunction | ကျသတင်း အသားချိန် လျှောက်ခံသည် |
| transitionDelay | ကျသတင်း ပြောင်းလဲ စတင် မည့် အချိန် |
| initial | အခွင့် ကို မူကြမ်း ပြင်းအား ကို ကျပြုပါ၊ ကျမ်းကို ကြည့်ပါ。 initial. |
| inherit | အဖွဲ့အစည်း အဖိုင်အချုပ် မှ အခွင့် ကို သုံးစွဲပါ၊ ကျမ်းကို ကြည့်ပါ。 inherit. |
နည်းပါးစွာ
| မူကြမ်း ပြင်းအား: | all 0 ease 0 |
|---|---|
| နိုင်ငံခြား သတင်း | သံစကား၊ အရာတွင် အဆိုပါ အခွင့် transition အခွင့်. |
| CSS ပုံစံ: | CSS3 |
ဘာသာစကား ထောက်ပံ့
အော်ဒီယိုအရာတွင် အခြေခံ ကုသိုလ် သဘော ကို သိရှိသည်。
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 26.0 | 10.0 | 16.0 | 6.1 | 12.1 |
- အရှေ့စာ transformStyle
- နောက်ပိုင်းစာ transitionProperty
- အဆင်းတက်ခြင်း ပြန် HTML DOM Style အရာဝတ္တု
