Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][JavaScript] Kolorowanie linku
Forum PHP.pl > Forum > Przedszkole
gryzly123
Witam smile.gif

Chciałem postawić sobie banalną, acz ciekawie wyglądającą stronę i zebrało mi się na dość dziwny kaprys. Otóż mam listę linków w divie odwołujących się do iframe'u (co widać w kodzie smile.gif):

  1. <div id="block">
  2. <a href="home.php" target="src">Home</a>
  3. <a href="bio.html" target="src">Link 1</a>
  4. <a href="music.php" target="src">Link 2</a>
  5. <a href="contact.html" target="src">Contact</a>
  6. <a href="sm.html" target="src">Link 3</a></div>


Dla owych linków dorzuciłem kod css sprawiający, że mają biały cień i podkreślenie (górne+dolne) po najechaniu.

  1. a:link { color: white; text-decoration: none;}
  2. a:visited { color:white;}
  3. a:hover { -moz-text-shadow: 0px 0px 20px #FFF;
  4. -webkit-text-shadow: 0px 0px 20px #FFF;
  5. text-shadow: 0px 0px 20px #FFF;
  6. text-decoration: underline overline;}


Tymczasem chciałbym, aby link, który był naciśnięty ostatni, miał za sobą nieznikający cień w kolorze czerwonym wink.gif
Jak się domyślam ma to związek z javascriptem modyfikującym css, niestety JS to coś, w czym jestem całkowicie zielony :<
A więc:
-> Na starcie czerwona poświata pojawia się nad przyciskiem Home
-> Po naciśnięciu innego linku z Home'a cień przenosi się na owy kliknięty link
-> Na tej samej zasadzie linki "wymieniają się" cieniem między sobą

Moją prośbą byłby gotowy skrypt opatrzony komentarzem, gdyż fajnie byłoby rozumieć to na przyszłość. Oczywiście nie pogardzę też jakimś dobrym tutorialem krok-po-kroku, jakoś sobie poradzę smile.gif

Za pomoc będą oczywiście plusy smile.gif

Pozdrawiam wink.gif
CuteOne
50 zł przelewem to dostaniesz ładny kod opatrzony komentarzem. a za darmo mogę dać ci poradę na przyszłość - my tu pomagamy a nie odwalamy robotę za innych...

ps. google -> js event onclick, js change style, js get element by id
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.