Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS]zaznaczanie aktywnej pozycji w menu css
Forum PHP.pl > Forum > Przedszkole
borpaw
Jak zrobić żeby wybrana opcja menu pozostawała zaznaczona?

  1. <style>
  2. li:hover
  3. {
  4. cursor:hand;
  5. color:red;
  6. }
  7. </style>
  8.  
  9. <ul>
  10. <li>poz</li>
  11. <li>poz</li>
  12. <li>poz</li>
  13. <li>poz</li>
  14. </ul>
pedro84
Cytat
pozostawała zaznaczona?

Co przez to rozumiesz?
toaspzoo
  1. li:active
  2. {
  3. cursor:hand;
  4. color:red;
  5. }
  6.  
  7. li:visited
  8. {
  9. cursor:hand;
  10. color:red;
  11. }
borpaw
Cytat(pedro84 @ 10.02.2012, 14:01:01 ) *
Co przez to rozumiesz?


no przesuwam myszką po menu zmienia sie kolor na pozycjach a jak klikne (wybiore) którąś to żeby pozostała wyróżniona
phpion
Proszę o zatytułowanie wątku w sposób lepiej opisujący problem - "menu css" niewiele mówi o problemie. W przeciwnym razie zostanie on zamknięty.

PS: Musisz stworzyć klasę np. current (o stylu takim jak :hover) dopisywać ją dynamicznie podczas wyświetlania strony na podstawie np. adresu aktualnej strony.
borpaw
Cytat(toaspzoo @ 10.02.2012, 14:03:36 ) *
  1. li:active
  2. {
  3. cursor:hand;
  4. color:red;
  5. }
  6.  
  7. li:visited
  8. {
  9. cursor:hand;
  10. color:red;
  11. }

To nie działa już próbowałem tego, zaznacza na chwilę i znika
pedro84
Cytat
To nie działa już próbowałem tego, zaznacza na chwilę i znika


Musisz zrobić tak jak Ci pisze @phpion. W CSS tego nie zrobisz.
borpaw
O coś takiego chodzi? to działa tak jak pytałem tylko myślałem że można to jakoś zrobić inaczej.
Bo w tym układzie wyświetlona strona musi aktualizować menu na aktywnej pozycji

  1. <style>
  2. li:hover, #active
  3. {
  4. cursor:hand;
  5. color:red;
  6. }
  7. </style>
  8.  
  9. <ul>
  10. <li>poz</li>
  11. <li id="active">poz</li>
  12. <li>poz</li>
  13. <li>poz</li>
  14. </ul>
i-skrypty.pl
W php:
  1. <a href="#"<?php if ($page == 'strona') echo ' class="current"; ?>>

W css:

  1. a.current { color: red; }
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.