Siirtymien Yhdistäminen
Voimme yhdistää kaikki siirtymään liittyvät ominaisuudet yhdelle riville.
transition: <property> <time> <time_function> <delay>;
Kuvitellaan, että meidän täytyy lisätä transition-ominaisuus elementtiin. Odotamme:
background-color
-ominaisuuden muutosta;- keston olevan
1.2s
; - aikafunktion olevan
ease-in-out
; - viiveen olevan
250ms
.
Pitkä muoto
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Lyhyt muoto
transition: background-color 1200ms ease-in-out 250ms;
Huomio
Selaimen kannalta syntaksissa ei ole eroa. Voimme valita minkä tahansa vaihtoehdon, josta pidämme enemmän.
Oliko kaikki selvää?
Kiitos palautteestasi!
Osio 3. Luku 6
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Awesome!
Completion rate improved to 2.04
Siirtymien Yhdistäminen
Pyyhkäise näyttääksesi valikon
Voimme yhdistää kaikki siirtymään liittyvät ominaisuudet yhdelle riville.
transition: <property> <time> <time_function> <delay>;
Kuvitellaan, että meidän täytyy lisätä transition-ominaisuus elementtiin. Odotamme:
background-color
-ominaisuuden muutosta;- keston olevan
1.2s
; - aikafunktion olevan
ease-in-out
; - viiveen olevan
250ms
.
Pitkä muoto
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Lyhyt muoto
transition: background-color 1200ms ease-in-out 250ms;
Huomio
Selaimen kannalta syntaksissa ei ole eroa. Voimme valita minkä tahansa vaihtoehdon, josta pidämme enemmän.
Oliko kaikki selvää?
Kiitos palautteestasi!
Osio 3. Luku 6