[HTML][CSS] Podświetlanie aktywnej strony w menu. Opcje

[BulwiaseK]

Witam.
Mam zamiar stworzyć szablon do strony internetowej z tym, że nie mogę rozwikłać jednego problemu:
Jak stworzyć menu, które po kliknięciu na odsyłacz wyświetla wybraną stronę, a dodatkowo podświetla tę pozycję?

[ixpack]

Przykład:

Mam 3 linki menu:
1. Klocki (adres będzie index.php?p=klocki)
2. Spłóczki (jw. p=sploczki)
3. Lizaki (jww. p=lizaki)

Teraz get'em pobieram p, czyli mając aktywną podstronę Klocki - mam też odpowiednie id - klocki (IMG:style_emoticons/default/wink.gif)
Sprawdzam linki w menu, jeżeli któryś ma id == klocki, to odpowiednio go styluję.

To oczywiście proste - łopatologiczne rozwiązanie.

[BulwiaseK]

Myślałem o czymś, co nie wymaga użycia php'a - JS, JQuery, Ajax etc.

[markonix]

Ajax wymaga PHP.

Można to zrobić w czystym CSS. Zerknij na moją stronę i wyłącz skrypt - wtedy działa sam CSS na podstawie id body.

Tu masz CSS.

Kod

#home #menu li a.home,
#oferta #menu li a.oferta,
#o_nas #menu li a.o_nas,
#kontakt #menu li a.kontakt {
background : #616161 url(images/trcorner.gif) no-repeat top right;
}

O co chodzi?
Po prostu gdy jesteś na stronie gdzie body ma ID "home" to poniższe formatowanie ma wpływ tylko na link #home #menu li a.home i tylko go wyróżnia określonym formatowaniem (tutaj przykład zmiany tła).

Ten post edytował markonix 18.06.2011, 16:00:48

[BulwiaseK]

Czy mógłbyś opisać bardziej działanie kodu? Nie chcę używać czegoś, czego działania nie rozumiem. Domyślam się, że chodzi tutaj o selektory potomkóe etc., ale nic więcej.

[markonix]

No tak jak powiedziałeś. Po polsku ta reguła mówi.
Wyróżnij (oznacz jako aktywny) odnośnik (a) o określonej klasie, który znajduje się w liście (li), która to ta lista znajduje się w kontenerze o ID (#menu), który to ten kontener znajduje się w kontenerze o określonym ID (u mnie jest to ID przypisane do body).

Dla lepszej przejrzystości ID BODY = KLASA LINKA ale nie ma to znaczenia.
Id #menu też nie ma tu znaczenia, po prostu u mnie to powinno być ale nie jest to częścią tego sposobu.

Nadal nie rozumiesz? No to firegub w dłoń i baw się CSSem na żywo.

[BulwiaseK]

markonix, już rozumiem. Nie od tej strony czytałem zawartość kodu.

Do zamknięcia.