CSS prijelazi vam omogućuju glatku promjenu vrijednosti svojstava tijekom određenog vremena.
Da biste stvorili efekt prijelaza, morate navesti dvije stvari:
- CSS svojstvo kojem želite dodati efekt
- trajanje učinka
Napomena: Ako dio trajanja nije naveden, prijelaz neće imati učinka, jer zadana vrijednost je 0.
Svojstvo transition-timing-function određuje krivulju brzine efekta prijelaza.
Svojstvo funkcije prijelaznog vremena može imati sljedeće vrijednosti:
- ease - određuje efekt prijelaza s polaganim pokretanjem, a zatim brzim, a zatim polako završavanje (ovo je zadano)
- linear - zadaje efekt prijelaza istom brzinom od početka do kraja
- ease-in - određuje efekt prijelaza s polaganim startom
- ease-out - određuje prijelazni učinak s sporim završetkom
- ease-in-out - određuje prijelazni učinak s sporim početkom i završetkom
- cubic-bezier (n, n, n, n) - omogućuje vam definiranje vlastitih vrijednosti u kubno-bezierovoj funkciji
Svojstvo transition-delay specificira odgodu (u sekundama) za efekt prijelaza.