Esempio
Lasciate che l'effetto di transizione ultima per 5 secondi:
div {
-webkit-transition-duration: 5s; /* Safari */
transition-duration: 5s;
}
Prova tu stesso " Definizione e utilizzo
La proprietà di transizione durata specifica per quanti secondi (s) o millisecondi (ms) un effetto di transizione necessario per completare.
| Valore di default: | 0s |
|---|---|
| Inherited: | no |
| animatable: | no. Read about animatable |
| Versione: | CSS3 |
| sintassi JavaScript: | object .style.transitionDuration="1s" Try it |
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
Numeri seguiti da -webkit-, -moz- o -o- specificano la prima versione che ha lavorato con un prefisso.
| Proprietà | |||||
|---|---|---|---|---|---|
| transition-duration | 26.0 4.0 -webkit- | 10.0 | 16,0 4.0 -moz- | 6.1 3.1 -webkit- | 12.1 10.5 -o- |
CSS Sintassi
transition-duration:time|initial|inherit;I valori delle proprietà
| Valore | Descrizione |
|---|---|
| time | Specifica quanti secondi o millisecondi un effetto di transizione necessario per completare. Il valore predefinito è 0s, che significa non ci sarà alcun effetto |
| initial | Consente di impostare questa proprietà al suo valore di default. Leggi iniziale |
| inherit | Eredita questo immobile dal suo elemento genitore. Leggi su erediterà |
Pagine correlate
Tutorial CSS: CSS3 Transitions
Di riferimento HTML DOM: transitionDuration property