Zmiana koloru dla aktywnej nawigacji

pytanie zadane 4 kwietnia 2016 w JavaScript przez Barus Stary wyjadacz (14,120 p.)

Witam!

Proszę o pomoc. Jak mógłby przykładowo wyglądać skrypt, który zmieniłby kolor aktywnego elementu nawigacji ? W sensie - załóżmy, że posiadam 3 elementy menu: Home, O mnie, Kontakt. Po najechaniu na dany element kolor można zmienić w CSS atrybutem hover, ale jak zmienić kolor na czas, w którym znajduję się na danej podstronie ? Np. kiedy wejdę na "Home", to kolor tego elementu będzie zmieniony do czasu kiedy przykładowo przejdę na "Kontakt", wtedy chciałbym, żeby to kolor elementu "Kontakt" został zmieniony. Proszę uprzejmie o poradę.

Pozdrawiam!

1 odpowiedź

odpowiedź 5 kwietnia 2016 przez iwan9449 Pasjonat (20,810 p.)

Najprościej do elementu menu dodać klasę np.: active, w niej odpowiednio ostylujesz aktywny element menu i w zależności od tego jak działa Twoja strona możesz tą klase dodawać ręcznie na odpowiednich podstronach do odpowiednich elementów albo wykorzystać do tego np js.

Pozdrawiam!

komentarz 5 kwietnia 2016 przez Barus Stary wyjadacz (14,120 p.)

Rozumiem :) A jakby to mogło wyglądać właśnie w JS? Chodzi mi tylko o przykładowy skrypt, który podmieniłby ten kolor.

Dziękuję za odpowiedź!

1	komentarz 5 kwietnia 2016 przez iwan9449 Pasjonat (20,810 p.) Możesz do każdego elementu menu przypisać zdarzenie click z funkcją, w której będzie przypisywał klasę active elementowi na który klikasz i usuwał tą klasę z pozostałych elementów listy. Pozdrawiam!

1	komentarz 5 kwietnia 2016 przez PreZmyK Pasjonat (21,470 p.) http://stackoverflow.com/questions/21111946/how-to-add-class-active-on-specific-li-on-user-click-with-jquery

komentarz 5 kwietnia 2016 przez Barus Stary wyjadacz (14,120 p.)

Czyli załóżmy w wielkim skrócie, że mam menu na liście numerowanej i do niej przypisuję zdarzenie onclick, w którym podaję nazwę funkcji z JS oraz posiadam jakąś klasę, którą wystylizuję na kolor, który ma być zmieniony. Wewnątrz ciała funkcji w JS, gdy nastąpi zdarzenie onclick danego elementu listy przypisuję wystylizowaną klasę, a reszcie elementów przypisuję tradycyjny wygląd ? :)

komentarz 5 kwietnia 2016 przez iwan9449 Pasjonat (20,810 p.)
edycja 5 kwietnia 2016 przez iwan9449

W dużym skrócie tak, z tym, że zdarzenie kliknięcia przypisujesz elementom listy, nie całej liście, (nie miałoby to sensu) :) Oczywiście zakładam, że znacz js w takim stopniu, żeby napisać odpowiedni skrypt :)