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

Jak zrobić takie menu?

VPS Starter Arubacloud
0 głosów
266 wizyt
pytanie zadane 10 sierpnia 2020 w HTML i CSS przez Layoutowiec Mądrala (5,470 p.)
Witam!
 

Robię stronę one page. Mam menu i chciałbym aby po kliknięciu jednej z zakładek zjechało na odpowiednią sekcje na stronie

Miłego wieczoru!

3 odpowiedzi

+3 głosów
odpowiedź 10 sierpnia 2020 przez ScriptyChris Mędrzec (190,190 p.)

Najprościej będzie, jeśli nadasz id sekcjom, do których chcesz przewinąć stronę po kliknięciu. Natomiast nawigowalnym elementom menu (najlepiej gdyby to były linki) nadaj atrybut href z wartością # oraz id-kiem danej sekcji, np.:

<ol>
  <li>
    <a href="#firstSection">Idź do sekcji pierwszej</a>
  </li>
  <li>
    <a href="#secondSection">Idź do sekcji drugiej</a>
  </li>
  <li>
    <a href="#thirdSection">Idź do sekcji trzeciej</a>
  </li>
</ol>

<section id="firstSection">Sekcja pierwsza</section>
<section id="secondSection">Sekcja druga</section>
<section id="thirdSection">Sekcja trzecia</section>

Więcej będzie można doradzić, gdy pokażesz kod.

1
komentarz 10 sierpnia 2020 przez jankustosz1 Nałogowiec (35,880 p.)
wydaje mi się, że autorowi chodziło o smooth scrolling
1
komentarz 10 sierpnia 2020 przez ScriptyChris Mędrzec (190,190 p.)
Możliwe, ale nie napisał tego w pytaniu. :)
komentarz 11 sierpnia 2020 przez Layoutowiec Mądrala (5,470 p.)
Racja raczej chodziło mi o ten smooth scrolling, jednak właściwie to to o czym nasipał @JSHolic w zupełności wystarczy, dzięki za pomoc :)
+2 głosów
odpowiedź 11 sierpnia 2020 przez KumberTwo Dyskutant (8,270 p.)

Pan Mirosław Zelent ma całkiem fajny poradnik dotyczący smooth scrollingu.

+1 głos
odpowiedź 10 sierpnia 2020 przez creend Gaduła (4,700 p.)
1. Pobrać element/elementy menu po którego kliknięciu ma zjeżdżać, oraz sekcje do zjazdu

2. Dać elementom menu addEventListener na clicka i przekazać funkcję która animuje. Najprościej będzie w JQuery

Podobne pytania

0 głosów
2 odpowiedzi 201 wizyt
pytanie zadane 2 czerwca 2018 w HTML i CSS przez Layoutowiec Mądrala (5,470 p.)
0 głosów
2 odpowiedzi 7,241 wizyt
pytanie zadane 10 lutego 2016 w HTML i CSS przez Kubala94 Początkujący (360 p.)
+1 głos
3 odpowiedzi 978 wizyt
pytanie zadane 17 kwietnia 2017 w HTML i CSS przez Vorex444 Dyskutant (9,610 p.)

92,454 zapytań

141,262 odpowiedzi

319,089 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!

...