transition
Misol
div elementining ko‘rinishini asta-sekin o‘zgartirish uchun sichqonchani uning ustiga olib boring:
document.getElementById("myDIV").style.transition = "all 2s";O‘zingiz sinab ko‘ring »
Tavsif
transition xususiyati to‘rtta transition xususiyati uchun qisqartma (shorthand) xususiyatdir:
transitionProperty, transitionDuration, transitionTimingFunction va transitionDelay.
Eslatma: transitionDuration xususiyatini har doim ko‘rsating, aks holda davomiylik 0 bo‘ladi va o‘tish (transition) hech qanday ta’sir qilmaydi.
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi sonlar xususiyatni to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Xususiyat | |||||
|---|---|---|---|---|---|
| transition | 26.0 | 10.0 | 16.0 | 6.1 | 12.1 |
Sintaksis
transition xususiyatini qaytarish:
object.style.transition
transition xususiyatini o‘rnatish:
object.style.transition = "property duration timing-function delay|initial|inherit"
Xususiyat qiymatlari
| Qiymat | Tavsif |
|---|---|
| transitionProperty | O‘tish effekti qo‘llaniladigan CSS xususiyatining nomini belgilaydi |
| transitionDuration | O‘tish effekti tugashi uchun necha soniya yoki millisoniya ketishini belgilaydi |
| transitionTimingFunction | O‘tish effektining tezlik egri chizig‘ini belgilaydi |
| transitionDelay | O‘tish effekti qachon boshlanishini 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: | all 0 ease 0 |
|---|---|
| Qaytariladigan qiymat: | Elementning transition xususiyatini ifodalovchi String |
| CSS versiyasi | CSS3 |
Tegishli sahifalar
CSS ma’lumotnomasi: transition xususiyati
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!