Hopp til hovedinnhold

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, yeller 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!

Relevante lenker anbefalt av forfatteren

Liker du innlegget?

Del gjerne med kollegaer og venner