Exemplu
Modificarea curbei de viteză a unui efect de tranziție:
document.getElementById("myDIV").style.transitionTimingFunction = "linear";
Încearcă - l singur » Definiție și utilizare
Proprietatea transitionTimingFunction specifică curba vitezei efectului de tranziție.
Această proprietate permite un efect de tranziție pentru a schimba viteza peste durata acesteia.
Suport pentru browser-
Proprietatea transitionTimingFunction este acceptată în Internet Explorer 10, Firefox, Opera și Chrome.
Safari susține o alternativă, proprietatea WebkitTransitionTimingFunction.
Notă: Proprietatea transitionTimingFunction nu este acceptată în Internet Explorer 9 și versiunile anterioare.
Sintaxă
Întoarcere proprietatea transitionTimingFunction:
object .style.transitionTimingFunction Setați proprietatea transitionTimingFunction:
object .style.transitionTimingFunction ="ease|linear|ease-in|ease-out|ease-in-out|cubic-bezier()|
initial|inherit"
Valori de proprietate
| Valoare | Descriere |
|---|---|
| ease | Valoare implicită. Specifică un efect de tranziție cu un început lent, apoi rapid, apoi se încheie lent (equivalent to cubic- bezier(0.25,0.1,0.25,1) ) |
| linear | Specifică un efect de tranziție cu aceeași viteză de la început până la sfârșit (equivalent to cubic- bezier(0,0,1,1) ) |
| ease-in | Specifică un efect de tranziție cu un început lent (echivalent cu cubic- bezier(0.42,0,1,1) ) |
| ease-out | Specifică un efect de tranziție cu un capăt lent (echivalent cu cubic- bezier(0,0,0.58,1) ) |
| ease-in-out | Specifică un efect de tranziție cu un început lent și sfârșit (echivalent cu cubic- bezier(0.42,0,0.58,1) ) |
| cubic- bezier( n , n , n , n ) | Definiți propriile valori în funcția Cubic-Bezier. Valorile posibile sunt valori numerice de la 0 la 1 |
| initial | Setează această proprietate la valoarea implicită. Citiți despre inițială |
| inherit | Mosteneste această proprietate de la elementul părinte. Citiți despre moștenesc |
Detalii tehnice
| Valoare implicită: | uşura |
|---|---|
| Întoarcere Valoare: | Un șir, care reprezintă proprietatea de tranziție-calendarul-funcție a unui element |
| CSS Versiune | CSS3 |
Pagini similare
Referință CSS: transition-timing-function property de transition-timing-function property
<Style Object