Useiden Animaatioiden Yhdistäminen
Voimme käyttää lyhytmuotoista tapaa määrittää kaikki animaatio-ominaisuudet. Syntaksi on seuraava:
animation: <name> <duration> <timing_function> <delay> <iteration-count> <direction> <fill-mode> <play-state>
Kirjoitetaan seuraavat ominaisuudet tiiviisti uudelleen.
Pitkä tapa
animation-name: Rotation;
animation-duration: 5s;
animation-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
animation-delay: 100ms;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-fill-mode: backwards;
animation-play-state: running;
Lyhytmuoto
animation: Rotation 5s cubic-bezier(0.075, 0.82, 0.165, 1) 100ms infinite alternate backwards running;
Tämä näyttää sekavalta, ja jonkin arvon voi helposti unohtaa. Meillä on kuitenkin tällainen mahdollisuus käytettävissä.
Huomio
Selaimen kannalta ei ole eroa, käytetäänkö animaation määrittelyssä lyhytmuotoa vai pitkää tapaa.
Kiitos palautteestasi!
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Awesome!
Completion rate improved to 2.04
Useiden Animaatioiden Yhdistäminen
Pyyhkäise näyttääksesi valikon
Voimme käyttää lyhytmuotoista tapaa määrittää kaikki animaatio-ominaisuudet. Syntaksi on seuraava:
animation: <name> <duration> <timing_function> <delay> <iteration-count> <direction> <fill-mode> <play-state>
Kirjoitetaan seuraavat ominaisuudet tiiviisti uudelleen.
Pitkä tapa
animation-name: Rotation;
animation-duration: 5s;
animation-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
animation-delay: 100ms;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-fill-mode: backwards;
animation-play-state: running;
Lyhytmuoto
animation: Rotation 5s cubic-bezier(0.075, 0.82, 0.165, 1) 100ms infinite alternate backwards running;
Tämä näyttää sekavalta, ja jonkin arvon voi helposti unohtaa. Meillä on kuitenkin tällainen mahdollisuus käytettävissä.
Huomio
Selaimen kannalta ei ole eroa, käytetäänkö animaation määrittelyssä lyhytmuotoa vai pitkää tapaa.
Kiitos palautteestasi!