Zachowanie się scrolla dynamiczne przewijanie
Właściwość CSS scroll-behavior (zachowanie scroll) pozwala nam określić, w jaki sposób ma nastąpić przewinięcie treści strony podczas skoku z jednego punktu do drugiego.
Z podobnym efektem często mamy do czynienia na stronach typu One Page. Tyle, że tam analogiczny efekt animacji uzyskujemy z pomocą JS. Chodzi o efekt kiedy przesuwamy się szybko lub płynnie do konkretnego miejsca na stronie.
Jakie wartości przyjmuje scroll-behavior
A jak to w praktyce wygląda? Najlepiej zobaczcie na poniższe przykłady:
Przykłady działania:
W pierwszym przypadku jak widzicie skaczemy od miejsca do miejsca. W drugim z kolei przesuwamy się płynnie. Kodu obu przykładów nie będę wam przepisywać możecie sprawdzić je na Codepen.
Jeżeli dopiero zaczynacie budowę stron zapraszam was również do zapoznania się z wpisem na temat etykiet i kotwic. To właśnie z ich pomocą wyznaczyłam miejsca gdzie menu ma się przesówać.
| Właściowść | Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| text-align-last | 61 | nie wspiera | 36 | nie wspiera | Tak |
źródła:
Jak w przypadku wielu różnych tematów tak i w przypadku marki osobistej pojawiło się przez…
Choć zabrzmi to może nieco dziwnie to wprowadzenie AI (sztucznej inteligencji) do naszego życia było…
Widmo Brockenu to dość rzadko spotykane zjawisko optyczne, najczęściej widywane w wysokich partiach gór. Można…
Zacznę może od tego, że relikwia, relikwii nie równa. Wiem jeśli nie ma się pojęcia…
Logo stanowi jeden z ważniejszych elementów tożsamości wizualnej praktycznie każdej firmy, marki czy projektu. Logo…
Budując własną markę osobistą lub chcąc ją zbudować trzeba liczyć się z wieloma wyzwaniami. Jednym…