transition-durationVara, tavaliselt kasutatakse osana transitionstenografist, kasutatakse määratleda kestust kindlaksmääratud üleminekut. See tähendab, kui kaua kulub sihitud elemendi üleminekuks kahe määratletud oleku vahel.
.example ( transition-duration: 3s; )Väärtus võib olla üks järgmistest:
- Kehtiv ajaväärtus (määratletud sekundites või millisekundites)
- Komaeraldusega ajaväärtuste loend mitme elemendi ühele elemendile üleminekuks
Vaikeväärtus transition-durationon 0s, mis tähendab, et üleminekut ei toimu ja atribuudi muutus toimub kohe, isegi kui muud üleminekuga seotud atribuudid on määratletud. Ajaväärtust saab täpsema ajastuse korral väljendada kümnendpõhise arvuna ja negatiivsed väärtused pole lubatud.
Järgmine CodePen näitab hõljutuse efekti kastil, mis kasutab tausta värvi järkjärguliseks muutmiseks transition-durationväärtust 1s:
Kõigi toetavate brauserite ühilduvuseks on vaja hankija eesliiteid, kusjuures viimane süntaks on deklareeritud viimasena:
.example ( -webkit-transition-duration: 700ms; -moz-transition-duration: 700ms; -o-transition-duration: 700ms; transition-duration: 700ms; )IE10 (IE esimene stabiilne versioon, mida toetada transition-duration) ei vaja -ms-eesliidet.
Brauseri tugi
| Chrome | Safari | Firefox | Ooper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Töötab | Töötab | 4+ | 10,5+ | 10+ | 2.1+ | 3,2+ |