CSS-animatiegenerator voor luie mensen.
CSS-animaties
CSS maakt animatie van HTML-elementen mogelijk zonder JavaScript of Flash te gebruiken
In dit hoofdstuk leert u over de volgende eigenschappen:
- @keyframes
- animatienaam
- animatieduur
- animatie-vertraging
- animatie-iteratie-telling
- animatie-richting
- animatie-timing-functie
- animatie-vulmodus
- animatie
Browserspecifieke voorvoegsels
Sommige oudere browsers hebben specifieke voorvoegsels (-webkit-) nodig om de animatie-eigenschappen te begrijpen
Wat zijn CSS-animaties?
Een animatie laat een element geleidelijk veranderen van de ene stijl naar de andere.
U kunt zoveel CSS-eigenschappen wijzigen als u wilt, zo vaak u wilt.
Om CSS-animatie te gebruiken, moet u eerst enkele keyframes voor de animatie specificeren.
Keyframes bevatten welke stijlen het element op bepaalde tijden zal hebben.
De @keyframes-regel
Wanneer u CSS-stijlen opgeeft binnen de @keyframes-regel, zal de animatie op bepaalde tijden geleidelijk veranderen van de huidige stijl naar de nieuwe stijl.