Bepaal hoe de koptekst zich gedraagt als bezoekers een pagina omlaag gaan. Zet het zo vast zodat navigatie binnen handbereik blijft, laat het verdwijnen of vervagen om de inhoud het volledige scherm te geven en verfijn dan de richting, afstand en timing.
Een scrolleffect voor de kop toevoegen en instellen
Stem het gedrag van de koptekst af op de pagina. Houd het op zijn plaats wanneer bezoekers het menu op elk punt nodig hebben, of wis het van het scherm wanneer de inhoud de pagina op zichzelf moet dragen.
Om een scrolleffect toe te voegen aan de koptekst:
Ga naar je editor.
Klik op de koptekst.
Klik in de actiebalk op Gedrag wijzigen.
Selecteer een Scrolleffect.
Klik op Alle ontwerpopties om het effect in te stellen in het Inspector-paneel.
(In het Inspector-paneel) Klik op Koptekstinstellingen om het onderdeel uit te vouwen.
Stel het scrolleffect in dat je hebt gekozen:
De koptekst scrolt weg met de rest van de pagina. Dit is het standaardgedrag en het heeft geen verdere instellingen.
De koptekst verdwijnt als bezoekers omlaag scrollen.
Overlapping: Kies of de koptekst boven het onderdeel eronder staat.
Geen: De koptekst behoudt zijn eigen ruimte bovenaan de pagina. Stel een Verschuiving bovenaan (%) in om de afstand tussen de koptekst en de bovenkant van de pagina toe te voegen.
Volgend onderdeel: De koptekst staat boven het volgende onderdeel terwijl bezoekers scrollen. Je kunt Aan onderkant instellen inschakelen om de koptekst naar beneden te verplaatsen.
Kleur bij scrollen: Schakel dit in om de achtergrondkleur van de koptekst te wijzigen terwijl bezoekers scrollen, kies dan een kleur en stel de dekking in.
Richting: Kies waar de koptekst naartoe gaat wanneer deze het scherm verlaat.
Afstand: Stel in hoeveel van de koptekst weg beweegt. Bij 100% verlaat het het scherm volledig.
Vertraging (sec): Stel in hoe lang je moet wachten voordat het effect begint.
Duur (sec): Stel in hoe lang het effect duurt.
Gemak: Selecteer hoe de animatie versnelt en vertraagt (bijvoorbeeld: Lineair (geen), In-sine, Kubisch uit).
De koptekst blijft op zijn plaats terwijl bezoekers scrollen, dus deze is altijd zichtbaar.
Overlapping: Kies of de koptekst boven het onderdeel eronder staat.
Geen: De koptekst behoudt zijn eigen ruimte bovenaan de pagina. Stel een Verschuiving bovenaan (%) in om de afstand tussen de koptekst en de bovenkant van de pagina toe te voegen.
Volgend onderdeel: De koptekst staat boven het volgende onderdeel terwijl bezoekers scrollen. Je kunt Aan onderkant instellen inschakelen om de koptekst naar beneden te verplaatsen.
Kleur bij scrollen: Schakel dit in om de achtergrondkleur van de koptekst te wijzigen terwijl bezoekers scrollen, kies dan een kleur en stel de dekking in.
De koptekst vervaagt uit het zicht naarmate bezoekers omlaag scrollen.
Overlapping: Kies of de koptekst boven het onderdeel eronder staat.
Geen: De koptekst behoudt zijn eigen ruimte bovenaan de pagina. Stel een Verschuiving bovenaan (%) in om de afstand tussen de koptekst en de bovenkant van de pagina toe te voegen.
Volgend onderdeel: De koptekst staat boven het volgende onderdeel terwijl bezoekers scrollen. Je kunt Aan onderkant instellen inschakelen om de koptekst naar beneden te verplaatsen.
Kleur bij scrollen: Schakel dit in om de achtergrondkleur van de koptekst te wijzigen terwijl bezoekers scrollen, kies dan een kleur en stel de dekking in.
Vertraging (sec): Stel in hoe lang je moet wachten voordat het effect begint.
Duur (sec): Stel in hoe lang het effect duurt.
Het scrolleffect verwijderen
Schakel het effect uit wanneer je wilt dat de koptekst weer met de pagina meebeweegt. De koptekst behoudt zijn ontwerp en alleen het scrollgedrag verandert.
Om het scrolleffect te verwijderen:
- Ga naar je editor.
- Klik op de koptekst.
- Klik in de actiebalk op Gedrag wijzigen.
- Selecteer Scrollen met website in de Scrolleffect-dropdown.
Bouw zelf het gedrag van de koptekst. Schakel geavanceerde instellingen in om te scheiden waar de koptekst staat van hoe deze beweegt. Hiermee kun je bijvoorbeeld de koptekst onderaan het scherm plakken of je eigen timing en vertraging instellen.
Om met geavanceerde koptekstinstellingen te werken:
Ga naar je editor.
Klik op de koptekst.
Klik in de actiebalk op Gedrag wijzigen.
Klik op Alle ontwerpopties.
Klik bovenaan het Inspector-paneel op het Meer acties-pictogram 
en schakel Geavanceerde instellingen in.
Klik op Koptekst-instellingen om het onderdeel uit te vouwen.
Selecteer een Positietype:
Standaard: De koptekst heeft geen vaste positie en scrolt weg met de rest van de pagina.
Sticky: De koptekst blijft aan een rand van het scherm plakken terwijl bezoekers scrollen.
Vastgezet: De koptekst is vastgezet aan het scherm, over de inhoud van de pagina.
Stel het positietype in dat je hebt gekozen:
Kies of je het volgende aan de koptekst wilt toevoegen:
Kleur bij scrollen: Schakel dit in om de achtergrondkleur van de koptekst te wijzigen terwijl bezoekers scrollen, kies dan een kleur en stel de dekking in.
Overgang: Schakel dit in om een animatie toe te voegen die bezoekers zien wanneer ze terug scrollen naar de koptekst.
Selecteer Verplaatsen of Vervagen.
Stel de animatie in:
Richting: Kies waar de koptekst naartoe wordt verplaatst.
Afstand: Stel in hoe ver de koptekst wordt verplaatst (%).
Gemak: Selecteer hoe de animatie versnelt en vertraagt (bijvoorbeeld: Lineair (geen), In-sine, Kubisch uit).
Vertraging (sec) en Duur (sec): Stel de timing van de animatie in.
Let op:
De beschikbare instellingen zijn afhankelijk van de overgang die je kiest (Verplaatsen of Vervagen).
Vastzetten: Selecteer aan welke rand de koptekst blijft plakken: Boven, Onder of Boven en onder.
Offset: Stel de afstand (%) tussen de koptekst en die rand in.
Vooraan behouden: Schakel het selectievakje in om de koptekst boven de andere inhoud van de pagina te houden.
Kleur bij scrollen: Schakel dit in om de achtergrondkleur van de koptekst te wijzigen terwijl bezoekers scrollen, kies dan een kleur en stel de dekking in.
Overgang: Activeer de schakelaar om een effect toe te voegen wanneer bezoekers op en neer scrollen.
Selecteer Verplaatsen of Vervagen.
Stel de animatie in:
Richting: Kies waar de koptekst naartoe wordt verplaatst.
Afstand: Stel in hoe ver de koptekst wordt verplaatst (%).
Gemak: Selecteer hoe de animatie versnelt en vertraagt (bijvoorbeeld: Lineair (geen), In-sine, Kubisch uit).
Vertraging (sec) en Duur (sec): Stel de timing van de animatie in.
Let op:
De beschikbare instellingen zijn afhankelijk van de overgang die je kiest (Verplaatsen of Vervagen).
Aan onderkant scherm instellen: Schakel dit in om de koptekst aan de onderkant van het scherm te bevestigen in plaats van bovenaan.
Kleur bij scrollen: Schakel dit in om de achtergrondkleur van de koptekst te wijzigen terwijl bezoekers scrollen, kies dan een kleur en stel de dekking in.
Overgang: Activeer de schakelaar om een effect toe te voegen wanneer bezoekers op en neer scrollen.
Selecteer Verplaatsen of Vervagen.
Stel de animatie in:
Richting: Kies waar de koptekst naartoe wordt verplaatst.
Afstand: Stel in hoe ver de koptekst wordt verplaatst (%).
Gemak: Selecteer hoe de animatie versnelt en vertraagt (bijvoorbeeld: Lineair (geen), In-sine, Kubisch uit).
Vertraging (sec) en Duur (sec): Stel de timing van de animatie in.
Let op:
Veelgestelde vragen
Klik op een vraag hieronder om meer te lezen over koptekst-scrolleffecten.
Waarom zie ik de 'Scrolleffect'-dropdown niet meer zien?
Deze optie is beschikbaar wanneer geavanceerde instellingen zijn uitgeschakeld. Als je het niet kunt zien, heb je mogelijk de geavanceerde instellingen-schakelaar voor de koptekst ingeschakeld.
Druk op Option + I of Alt + I om terug te schakelen.
Wat is het verschil tussen een scrolleffect en de animaties op het Beweging-tabblad?
Een scrolleffect bepaalt hoe de koptekst zelf zich gedraagt terwijl de pagina scrolt, en je stelt dit in onder Koptekst-instellingen in het Inspector-paneel.
Het Beweging-tabblad in het Inspector-paneel voegt nog een bewegingslaag toe aan de koptekst. Je kunt bijvoorbeeld een aanwijs- of klikanimatie toepassen om bezoekers betrokken te houden bij de koptekst.
