Animaties, overgangen, filters en maskers

Vooraleer je hiervan gebruik maakt, moet je goed begrijpen hoe CSS-klassen functioneren. Bekijk hiervoor de les op https://www.schoolvoorbeeld.be/cursuswebdesign/html-vormgeven-css#movie

1. CSS-animaties en -transities

Met CSS kan je elementen ook animeren of er overgangseffecten aan toevoegen.

Plak de volgende regel bovenaan in uw CSS-bestand:

@import url('https://www.schoolvoorbeeld.be/css/crowl.animations.css');

Kies de gewenste CSS-klasse: CSS-animaties

Je kan ook filters toevoegen aan je afbeeldingen of elementen:

Effect	CSS-klasse	CSS-klasse voor muisover-effect
grijstinten	bw	bwOnMouseOver
sepia	sepia	sepiaOnMouseOver
negatief	invert	invertOnMouseOver
zacht vervagen	softblur	softblurOnMouseOver
laag bovenop	overlay	overlayOnMouseOver
verschil	difference	differenceOnMouseOver
vermenigvuldigen	multiply	multiplyOnMouseOver
...	...	...