Samenvatting
Met de scrollsnelheid laat je een blok, een element of een achtergrond langzamer of sneller meebewegen dan de pagina. Dat verschil in snelheid geeft diepte en heet parallax.
Het getal is een percentage. 100 is gelijk met de pagina, lager is langzamer en dieper, hoger is sneller.
Er zijn twee velden, beide op het tabblad Instellingen. Scrollsnelheid staat bij een blok en bij vrijwel elk element, Achtergrond scrollsnelheid alleen bij een blok.
Het resultaat is in de editor niet te zien. Je bekijkt het in de voorvertoning of op je gepubliceerde website.
Wanneer gebruik je dit?
Je gebruikt dit als een achtergrond diepte moet krijgen. Een foto achter je tekst die trager meebeweegt, laat je pagina ruimtelijk aanvoelen.
Je gebruikt het ook bij een decoratief element dat mag opvallen zonder de aandacht te trekken van je tekst.
En je kiest hier tussen twee dingen: beweegt je blok zelf anders mee, of alleen zijn achtergrond. Daarvoor zijn er twee velden.
Wil je een element laten bewegen zodra het in beeld komt, dan is dat iets anders. Lees Effect kiezen.
Hoe werkt dit in Mach3Blocks?
Je selecteert een blok of een element en opent rechts in het instellingenpaneel het tabblad Instellingen. Daar staan de scrollvelden bij elkaar.
Beide velden zijn getalvelden met een percentage erachter. Zolang je niets invult, staat er een grijze 100 en beweegt alles gewoon mee.
| Veld | Bij welke selectie | Wat het regelt | Bijzonderheden |
|---|---|---|---|
| Scrollsnelheid | bij een blok en bij vrijwel elk element | hoe snel dat blok of element zelf meebeweegt | vanaf 0, zonder bovengrens |
| Achtergrond scrollsnelheid | alleen bij een blok | hoe snel de achtergrond van dat blok meebeweegt, los van het blok | werkt alleen met een achtergrondafbeelding of achtergrondvideo |
Wat het getal betekent
| Waarde | Wat er gebeurt |
|---|---|
| 0 | je element blijft bij het scrollen op zijn plek in het beeld staan |
| 50 | je element beweegt half zo snel als de pagina en lijkt verder weg |
| 100 | je element beweegt met de pagina mee. Dit is gelijk aan niets invullen |
| 200 | je element beweegt twee keer zo snel als de pagina |
De laagste waarde is dus niet "nauwelijks meebewegen" maar volledig stilstaan. Vul je 0 in, dan schuift de pagina onder je element door.
Vul je precies 100 in, dan haalt Mach3Blocks de instelling weer weg. Het resultaat is hetzelfde als een leeg veld.
Waarom je het in de editor niet ziet
Bekijk het resultaat in de voorvertoning. Lees Website voorvertonen.
Wat je ermee kunt
Je zet met twee getallen een verschil in snelheid neer. Dat verschil is wat de bezoeker als diepte ervaart.
Wat elk getal doet, staat hierboven in de waardentabel. Daarnaast kun je per schermformaat een eigen waarde zetten.
Een waarde per schermgrootte
Achter beide velden staat de knop Schermgrootte waarde toevoegen. Daarmee geef je een schermformaat zijn eigen snelheid. Lees Opmaak per schermgrootte.
Binnen zo'n waarde per schermgrootte betekent 100 wel iets: op dat formaat beweegt je element gewoon mee.
| Schermformaat | Breedte |
|---|---|
| Telefoon staand | tot 479 pixels |
| Telefoon liggend | 480 tot 767 pixels |
| Tablet | 768 tot 1023 pixels |
| Laptop | 1024 tot 1279 pixels |
| Desktop | 1280 pixels en meer |
Wat er met je achtergrondafbeelding gebeurt
Beweegt een achtergrond anders dan zijn blok, dan heeft die achtergrond ruimte nodig om te bewegen. Mach3Blocks maakt haar daarom hoger dan het blok.
Het gevolg is dat je afbeelding verder wordt uitgesneden dan zonder parallax. Hoe veel hangt af van het verschil tussen je twee snelheden.
Kies daarom een afbeelding waarvan de randen mogen wegvallen. De achtergrond zelf stel je elders in. Lees Kleuren en achtergrond.
Grenzen en wat niet kan
| Wat je wilt | Kan het |
|---|---|
| Een scrollsnelheid voor een hele pagina | Nee, een pagina heeft geen tabblad Instellingen |
| Een scrollsnelheid in het thema | Nee, daar is dat tabblad er ook niet |
| Een achtergrondsnelheid bij een element | Nee, dat tweede veld staat alleen bij een blok |
| Een scrollsnelheid in een navigatie | Nee, daar wordt het veld weggehaald |
| Een scrollsnelheid bij een element in een carrousel | Nee, daar wordt het veld ook weggehaald |
| Een waarde boven de 200 | Ja, er is geen bovengrens |
| Het resultaat in de editor zien | Nee, bekijk het in de voorvertoning |
Op je live website verschijnt je scrollsnelheid pas nadat je opnieuw publiceert.
Voorwaarden en rechten
Voor deze twee velden is geen recht nodig. Wie de website in de editor kan openen, kan een scrollsnelheid invullen en weer weghalen.
Het tabblad Instellingen vraagt zelf ook geen recht. Voor de achtergrondafbeelding die het tweede veld nodig heeft, geldt dat wel: die staat op het tabblad Opmaak.
Welke rol het recht Websites/presentaties stijlen standaard heeft, staat in Thema uitgelegd.
Praktijkvoorbeelden
Je hebt een blok met een foto als achtergrond en een kop erover. Je wilt dat de foto rustiger beweegt dan de tekst.
Je selecteert het blok, opent het tabblad Instellingen en vult 50 in bij Achtergrond scrollsnelheid. De foto beweegt dan half zo snel als de pagina.
Het blok zelf houdt daarbij zijn gewone snelheid. Alleen de foto erachter loopt achter.
Je tweede geval is een decoratieve vorm naast je tekst. Je zet die vorm op 130, zodat hij iets sneller doorschuift dan de rest.
Je tekst laat je met rust. Parallax op tekst maakt het meelezen lastig, want de regels bewegen dan anders dan de pagina.
Het onderdeel dat de scrollsnelheid uitvoert, draait daar niet mee. Bekijk je pagina in de voorvertoning of publiceer haar.
Dan heeft het blok geen achtergrondafbeelding en geen achtergrondvideo. Zonder die achtergrond doet het veld niets.
Dan is het verschil in snelheid te groot, of staat er parallax op tekst. Houd het verschil klein en gebruik het op achtergronden.