Wix Harmony-editor: Een animatie toevoegen en aanpassen
4 min
In dit artikel
- Animatie toevoegen aan een element
- Een animatie aanpassen
- Animaties toevoegen aan je mobiele website
Dit artikel verwijst naar de nieuwe Wix Harmony-editor, die in januari 2026 is uitgebracht. Als je niet zeker weet of je de Wix Harmony-editor of de Wix Editor gebruikt, lees dan hier meer.
Breng je website tot leven met animaties die beweging en leven aan je ontwerp toevoegen. Kies uit opties zoals ingangs-, scroll-, loop- en muiseffecten, op basis van wanneer je wilt dat de animatie verschijnt.
Pas elke animatie aan om de exacte look te creëren die je wilt, door instellingen zoals afstand, duur en vertraging aan te passen aan je zicht. Alle mobiele animaties zijn ontworpen voor kleinere schermen, zodat je website er indrukwekkend uitziet op elk apparaat.
Wist je dat...
... je verschillende animaties en effecten kunt toepassen op hetzelfde element.
Animatie toevoegen aan een element
Voeg beweging en energie toe aan je website door animaties op je elementen toe te passen. Kies uit een verscheidenheid aan effecten om elk deel van je pagina tot leven te brengen en een ervaring te creëren die je bezoekers zullen onthouden.
Om animatie toe te voegen:
- Ga naar je editor.
- Klik op het betreffende element.
- Klik in de actiebalk op het Animatie-pictogram
. - Selecteer een animatie uit de beschikbare opties.
- Entree: De animatie voegt een element toe op het scherm. Het wordt maar één keer afgespeeld, wanneer het element voor het eerst verschijnt.
- Loop: De animatie wordt als een doorlopende loop afgespeeld.
- Scrollen: De animatie wordt afgespeeld wanneer een bezoeker dichter bij het element komt terwijl hij op en neer scrolt over de pagina.
- Muiseffecten: De animatie begint te bewegen wanneer de cursor van de bezoeker het element aanwijst.
Let op:
Elementen in je koptekst worden slechts één keer geanimeerd, tijdens het eerste bezoek aan de pagina.
Een animatie aanpassen
Nadat je een animatie aan een element hebt toegevoegd, kun je deze personaliseren om bij het uiterlijk van je website te passen. Pas opties zoals kracht, richting en vertraging aan om het exacte effect te creëren dat je wilt en je bezoekers zich betrokken te laten voelen.
Let op:
De beschikbare aanpassingsopties zijn afhankelijk van de animatie die je kiest.
Om de animatie aan te passen:
- Ga naar je editor.
- Selecteer het element.
- Klik in de actiebalk op het Animatie-pictogram .
- (Als je dat nog niet hebt gedaan) Selecteer een animatie uit de beschikbare opties.
- Klik op Aanpassen om de door jou gekozen animatie aan te passen:
- Kracht: Klik op de dropdown om te selecteren hoe sterk de animatie is wanneer deze wordt afgespeeld.
- Richting: Selecteer uit welke richting de animatie komt (bijvoorbeeld: met de klok mee, van rechts).
- Afstand: Gebruik de schuifregelaar om de afstand tussen het begin- en eindpunt van het effect te wijzigen.
- Duur: Gebruik de schuifregelaar om aan te passen hoelang de animatie moet worden afgespeeld.
- Vertraging: Gebruik de schuifregelaar om de vertraging tussen het laden van de pagina en het begin van de animatie te vergroten of te verkleinen.
- Snelheid: Sleep de schuifregelaar om de snelheid van het effect te wijzigen. Hoe lager het getal, hoe sneller het effect.
- Bewegingsas: Bepaal of het element horizontaal, verticaal of op beide assen beweegt.
- Animatietype: Kies uit in, uit of doorlopende animatietype bij het scrollen.
- Draaien: Kies het referentiepunt vanwaaruit het element begint te bewegen.
- Bewegingsstijl: Selecteer de intensiteit van de beweging, zoals voorzichtig of matig.
Animaties toevoegen aan je mobiele website
Je kunt animaties toevoegen aan je mobiele website, net als op desktop, zodat bezoekers genieten van een boeiende ervaring op elk apparaat. Mobiele animaties zijn speciaal ontworpen voor kleinere schermen en resoluties, dus alles past perfect zonder extra moeite.
Let op:
Animaties die je op desktop toevoegt, verschijnen ook op je mobiele website, maar je kunt een andere animatie voor mobiel kiezen (of uitschakelen) zonder de animatie op desktop te wijzigen.
Om animatie toe te voegen op mobiel:
- Ga naar je editor.
- Klik rechtsboven op de pagina op het Mobiel-pictogram
. - Klik op het betreffende element.
- Klik in de actiebalk op het Animatie-pictogram
. - Selecteer een animatie uit de beschikbare opties.
