Wix Editor: Een animatie toevoegen en aanpassen

Leestijd 4 minuten
Gebruik animaties om je website tot leven te brengen. Voeg effecten zoals 'Uitbreiden' en 'Onthullen' toe om creatieve, opvallende pagina's te maken en de aandacht van bezoekers op je inhoud te vestigen.
Je kunt animaties toepassen op verschillende elementen en zelfs verschillende effecten toepassen op hetzelfde element op zowel je desktop als mobiele websites. Animatie op je mobiele website is zo ingesteld dat deze geschikt is voor kleinere schermen, zodat je indruk kunt blijven maken op je bezoekers. Lees meer over animatie-effecten op je mobiele website
In dit artikel lees je hoe je:

Animatie toevoegen aan een element

Begin je website dynamisch en aantrekkelijk te maken door een animatie aan je elementen toe te voegen. Elke animatie heeft zijn eigen effect, zodat je ze kunt mixen met verschillende elementen en een onuitwisbare indruk bij je bezoekers kunt achterlaten.

Om animatie toe te voegen:

  1. Klik op het relevante element in de Editor.
  2. Klik op het Animatie-pictogram .
  3. Selecteer een animatie uit de beschikbare opties.
Let op:
Verwijder animatie-effecten van je elementen door op het Animatie-pictogram op het element te klikken en vervolgens op Geen te klikken.
Tip:
Je kunt animatie aan een groep elementen toevoegen door de groep te selecteren en op het Animatie-pictogram te klikken.

Een animatie aanpassen

Nadat je animatie aan een element hebt toegevoegd, kun je het aanpassen zodat het zich gedraagt zoals jij dat wilt en past bij het gevoel van je website.
Pas instellingen aan zoals de sterkte, richting en vertraging om een impact te creëren en je bezoekers te betrekken.

Om de animatie aan te passen:

  1. Klik op het relevante element in de Editor.
  2. Klik op het Animatie-pictogram .
  3. Klik op Aanpassen en gebruik de opties om je animatie aan te passen: 
    • Sterkte: Klik op het dropdownmenu en selecteer hoe sterk de animatie is wanneer deze wordt afgespeeld.
    • Richting: Selecteer vanuit welke richting de animatie binnenkomt, bijvoorbeeld met de klok mee of van rechts.
    • Afstand: Gebruik de schuifregelaar om de afstand tussen het begin- en eindpunt van het effect te vergroten of te verkleinen.
    • Duur: Gebruik de schuifregelaar om aan te passen hoelang de animatie moet worden afgespeeld.
    • Vertraging: Sleep de schuifregelaar om de vertraging tussen het laden van de pagina en het begin van de animatie te vergroten of te verkleinen.
    • Alleen de eerste keer: Klik op de schakelaar om in of uit te schakelen of de animatie alleen wordt weergegeven wanneer de pagina voor het eerst wordt geladen.
Let op:
De beschikbare aanpassingsopties zijn afhankelijk van de animatie die je kiest.

Animaties toevoegen aan je mobiele website

Je kunt niet alleen animaties toevoegen aan elementen op je desktopsite, maar ze ook toevoegen aan je mobiele website, zodat je bezoekers een goede browse-ervaring hebben vanaf al hun apparaten.
Animaties voor mobiel zijn speciaal ontworpen voor kleinere schermresoluties en -formaten, dus je hoeft je geen zorgen te maken over de hoeveelheid ruimte. 
Let op:
Als je wilt dat een element wordt geanimeerd op zowel de desktop- als de mobiele versie van je website, moet je het effect in beide Editors toevoegen. Animatie-effecten die je op desktop hebt toegevoegd, worden niet overgedragen naar je mobiele website, omdat ze zijn geoptimaliseerd voor verschillende schermformaten. 

Om animatie toe te voegen op mobiel:

  1. Ga naar je mobiele Editor.
  2. Klik op het relevante element.
  3. Klik op het Animatie-pictogram .
  4. Selecteer een animatie uit de beschikbare opties.
Belangrijk:
  • Animaties die toegevoegd zijn aan elementen in de kop worden alleen de eerste keer dat het element geladen wordt weergegeven.
  • Als een element wordt verborgen of weergegeven met Velo, moeten de animaties ook via Velo worden ingesteld. Lees meer
Problemen met je animatie?
Volg onze stappenFollow our steps om ervoor te zorgen dat ze zoals verwacht werken op je live website.

Vond je dit artikel nuttig?

|