animation
Misol
Qisqartma (shorthand) xususiyat yordamida <div> elementining animatsiyasini o‘zgartirish:
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";O‘zingiz sinab ko‘ring »
Tavsif
animation xususiyati oltita animatsiya xususiyati uchun qisqartma (shorthand) xususiyatdir:
animationName
animationDuration
animationTimingFunction
animationDelay
animationIterationCount
animationDirection
Eslatma: animationDuration xususiyatini har doim ko‘rsating, aks holda davomiylik 0 bo‘ladi va animatsiya hech qachon ijro etilmaydi.
Sintaksis
animation xususiyatini qaytarish:
object.style.animation
animation xususiyatini o‘rnatish:
object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"
Xususiyat qiymatlari
| Qiymat | Tavsif |
|---|---|
| animationName | Selektorga bog‘lamoqchi bo‘lgan keyframe nomini belgilaydi |
| animationDuration | Animatsiya tugashi uchun necha soniya yoki millisoniya ketishini belgilaydi |
| animationTimingFunction | Animatsiyaning tezlik egri chizig‘ini belgilaydi |
| animationDelay | Animatsiya boshlanishidan oldingi kechikishni belgilaydi |
| animationIterationCount | Animatsiya necha marta ijro etilishi kerakligini belgilaydi |
| animationDirection | Animatsiya navbatdagi sikllarda teskari yo‘nalishda ijro etilishi yoki etilmasligini belgilaydi |
| animationFillMode | Animatsiya bajarilmayotgan vaqtda u qaysi qiymatlarni qo‘llashini belgilaydi |
| animationPlayState | Animatsiya ishlayotgani yoki pauza qilinganini belgilaydi |
| initial | Bu xususiyatni standart qiymatiga o‘rnatadi. initial haqida o‘qing |
| inherit | Bu xususiyatni ota elementidan meros qilib oladi. inherit haqida o‘qing |
Texnik tafsilotlar
| Standart qiymat: | none 0 ease 0 1 normal none running |
|---|---|
| Qaytariladigan qiymat: | Elementning animation xususiyatini ifodalovchi String |
| CSS versiyasi | CSS3 |
Brauzerlarda qo‘llab-quvvatlash
animation — CSS3 (1999) imkoniyati.
U barcha brauzerlarda to‘liq qo‘llab-quvvatlanadi:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Ha | Ha | Ha | Ha | Ha | 11 |
Tegishli sahifalar
CSS ma’lumotnomasi: animation xususiyati
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!
