I dagens CSS skal vi se på scroll-snap-type
Scrolling på en nettside er noe man lenge har manipulert oppførselen til, ofte via javascript. Jeg kan huske trenden for ikke så mange år siden når det var populært å ha inndelte seksjoner som man hoppet til istedenfor scroll. Nå kan man gjøre dette helt uten javascript med scroll-snap-type
.
scroll-snap-type: x mandatory;
Her kan du definere i hvilken akse du vil at scrollen skal feste seg til. Det kan være x
, y
eller both
og man man velge mellom mandatory
som betyr at den alltid må frem til neste “snap” eller tilbake til forrige hvis man begynner å scrolle, eller proximity
som kun fester scrollen om man er nær nok neste.
Merk at scroll-snap-align
er satt til center
på divene inni overflowen for at scroll-snap-type
skal fungere.
Denne funksjonen har god støtte i alle nettlesere!