• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Płynne przewijanie w js.

VPS Starter Arubacloud
0 głosów
661 wizyt
pytanie zadane 9 lutego 2019 w JavaScript przez Byczek_ Bywalec (2,570 p.)

Witam mam problem ponieważ chciałbym, żeby po kliknięciu O WODZIE przeniosło nas trochę wyżej ponieważ w tym momencie jak widzimy na obrazku zasłania nam menu. Przepraszam za składnie zdania, ale nie wiem jak to opisać.

1 odpowiedź

+2 głosów
odpowiedź 9 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)
no ale pokaż jak robisz to przewijanie, bo masz to z tego co rozumiem zrobione tak? czyli kwestia po prostu dodania tych paru px wysokości menu, albo na sztywno jeśli menu ma zawsze stałą wysokość albo ściągnij sobie jego computed hight w momencie scrolla przy użyciu getComputedStyle.
komentarz 9 lutego 2019 przez Byczek_ Bywalec (2,570 p.)
komentarz 9 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)
ehh, czyli w ogóle nie czytałeś mojej odpowiedzi i nawet nie próbowałeś zrobić tego co proponuję...? tylko wolisz dać kod i "zróbcie mi to"... :(

A ponad to, wiem że się na tym forum powtarzam i jestem cięty ale taki już jestem, powiedz mi dlaczego W OGÓLE nie zacząłeś nawet szukać rozwiązania w google? Nawet nie poświęciłeś na to 2 sekund...

Oto przykłady z pierwszej piątki wyników google, do wyguglania w 10 sekund:

https://answers.themler.io/questions/76954/fixed-header-menu-overlaps-anchors-sections

https://www.caktusgroup.com/blog/2017/10/23/css-tip-fixed-headers-and-section-anchors/

https://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header
komentarz 9 lutego 2019 przez Byczek_ Bywalec (2,570 p.)
edycja 9 lutego 2019 przez Byczek_
Udało się ale jeszcze bez płynnego przechodzenia ale to już postaram się sam poszukać. A czy mógłbyś sprawdzić jeszcze kod?

https://byczowskik.github.io/water-side/
komentarz 9 lutego 2019 przez Tomek Sochacki Ekspert (227,510 p.)

Jeśli nie zależy Ci na jakieś wielkiej kontroli tego przewijania to dodaj po prostu w CSS:

html {
    scroll-behavior: smooth;
}

to zapewni Ci w miarę płynne przejście, nie ma co prawda opcji regulowania czasu itp. ale w praktyce najczęściej nie jest to potrzebne, a wymagałoby użycia JS, a tu masz natywne rozwiązanie przeglądarek, które jest w miarę fajnie wspierane (a nie oszukujmy się, jak ktoś na starszej to otworzy to nie będzie tragedii jak nie dostanie płynnego przejścia tylko przeskok).

komentarz 9 lutego 2019 przez Byczek_ Bywalec (2,570 p.)
A co do samej strony na razie nie masz żadnych zastrzeżeń?

Podobne pytania

0 głosów
1 odpowiedź 975 wizyt
pytanie zadane 31 stycznia 2018 w HTML i CSS przez Hardwell Dyskutant (8,960 p.)
0 głosów
1 odpowiedź 216 wizyt
pytanie zadane 4 stycznia 2018 w JavaScript przez Vorex444 Dyskutant (9,610 p.)
0 głosów
1 odpowiedź 866 wizyt
pytanie zadane 11 stycznia 2017 w JavaScript przez karolek110199 Nowicjusz (190 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...