Jak zrobić aktywny podświetlany background aktywnej strony


(Gerard Marondel) #1

Witam

Mam skrypt menu z kursu i takie menu:


tytuł menu

1

2

3

4

5

6

7

8

9Powołania Kapłańskie

[/code] oraz style css:
[code]#left a:link, #left a:active, #left a:visited, #right a:link, #right a:active, #right a:visited, #footer a:link, #footer a:visited {font-style:normal;font-weight:700;color:#ffffff;} #left a:hover, #right a:hover, #footer a:hover {font-style:normal;font-weight:700;color:#CCCC00;} #left .zawartosc a:link, #left .zawartosc a:visited {display: block;background-color:#5876B1;color:#fffff1;font-weight:700;text-align:left;padding:0;} #left .zawartosc a:hover {display: block;color: #000000;font-weight: bold;background:#ffffff;display:block;text-align:left;} #left .zawartosc dl a:active {color: #000000;font-weight:700;background:#fffff2;display:block;text-align:left;} #left .zawartosc ul, #left .zawartosc dd {text-indent:5px;display: block;list-style-type: none;border:1px solid navy;margin:0;padding:0;text-align:left;} #left .zawartosc ul li, #left .zawartosc dl {text-indent:5px;display: block;list-style-type: none;border-bottom:1px solid #FFFFFF;line-height:14px;margin:0;padding:0;text-align:left;} dt, dl {display:block;font-weight:700;font-style:italic;margin:0;padding:4px 0 4px 0;border-top:1px solid #ffffff;border-bottom:1px solid #FFFFF1;border-right:1px solid #ffffff;border-left:1px solid #FFFFF1;} dt:hover {background-color:#000044;} dt:active {background-color:#000074;}

i pragnę uzyskać następujący efekt: jeżeli ktoś najedzie na stronę np. 4 to background ma się podświetlać na kolor taki jak strona czyli kolor biały.

Próbuję rożnych sposobów, lecz nie daję rady jak to zrobić.

Proszę o pomoc i ewentualne sugestie.

Dziękuję.


(Irekxara) #2

a:link -- > wygląd odsyłacza na stronie

a:visited -- > wygląd odwiedzonego odsyłacza

a:hover --> wygląd po najechaniu myszką

a:active --> wygląd aktywny


(Gerard Marondel) #3

No niestety zmieniałem również i to co podałeś mi xulu , lecz nic z tego nie wyszło, czytałem że do pliki z menu trzeba dołożyć jakąś klasę np. active menu i potem w css dodać odpowiednie dane, lecz mam z tym problem, nie wiem czy da się to zrobić za pomocą js?.

Proszę o dalszą pomoc.


(mario@) #4

No ale przecież podświetla się na biało po najechaniu na link.

#left .zawartosc a:hover {display: block;color: #000000;font-weight: bold;background:#ffffff;display:block;text-align:left;}

(Gerard Marondel) #5

mario@ podświetla się na biało w momencie najechania i kliknięcia w link-odnośnik, a ja chcę aby na czas otwarcia danej "podstrony" ten link=odnośnik był podświetlany cały czas na nazwie danej podstrony.

Dziękuję za zainteresowanie się tą sprawą.


(mario@) #6

Tak sobie ustawiasz parametry dla "aktualnej strony"

#left .zawartosc .active a {}

(Gerard Marondel) #7

Dziękuję bardzo mario@ o taki właśnie efekt mi chodziło, wygląda banalnie prosto ale jakie trudne czasami do pomyślenia i wykonania.

Jeszcze raz wielkie dzięki :slight_smile: .

-- Dodane 11.02.2010 (Cz) 18:11 --

Mam jeszcze jeden problem tego samego typu ale teraz w menu poziomym, również chodzi mi o podświetlenie background aktywnej strony:

styl css:

ul.link, ul.link li.link {display:block;margin:0;padding:0;}

ul.link {position:static;}

ul.link li.link {float:left;border-width: 1px 1px 1px 1px;border-style: solid;/*border-color: transparent #25b #25b #9ce;*/-webkit-border-radius: 2px; -moz-border-radius: 2px;}

ul.link a:link, ul.link a:visited {text-decoration:none;display:block;width:110px;text-align:center;padding:5px 0;font-weight:700;background-color:#333298;color:#ffffff;border-top:0 solid #25b;}

ul.link a:hover {background-color:#ecf7ff;color:#cc0000;border-top:0 solid #333298;}

menu z linkami:

Dziękuję za odpowiedż.