PDA

Zobacz pełną wersję : Wyróżnienie aktywnego linku



raffiks
01-04-2012, 11:44
Witam. Zmagam się z problemem wyróżnienia aktywnego linku w menu poziomym. Dopiero się uczę pisania szablonów ale idzie całkiem nieźle. Nie mogę natomiast ustawić Joomla tak aby pokazywała na menu poziomym kolor linka tej podstrony na jakiej się znajduję w kolorze takim jak po najechaniu myszką na link. Próbowałem różnych kombinacji i nic. A oto Parametry jakie ustawiałem i jak są w tej chwili ustawione.

Joomla 1.5 - Konfiguracja - Optymalizacja dla wyszukiwarek
Proste adresy - Tak
Korzystaj z mod_rewrite - Tak (plik .htaccess)
Adresy z przyrostkiem - Nie

Projektant menu - Konfiguracja pozycji modułu tommenu - parametry systemu
Tytuł strony - Strona 1
Pokaż tytuł strony - Nie
inne pozycje tak samo tyko inny tytuł strony

Konfiguracja modułu topmenu
Parametry
Styl menu - Lista
Parametry rozszerzone
Przyrostek klas CSS menu - -nav
Pozostałe parametry
(wszystkie na nie)
Wyróżnij Aktywne - Tak

Kod index.php

<div id="topmenu">
<div class="right-bottom-bg">
<div class="left-bottom-bg">
<jdoc:include type="modules" name="user3"/>
</div>
</div>
</div>

Kod CSS


#topmenu
{
background: url('../images/menu-tail.gif') repeat-x scroll center top transparent;
margin-top: 3px;
}
#topmenu .left-bottom-bg { background: url('../images/topmenu-left-bg.gif') no-repeat scroll left bottom transparent; }
#topmenu .right-bottom-bg { background: url('../images/topmenu-right-bg.gif') no-repeat scroll right bottom transparent; }
ul.menu-nav
{
list-style: none outside none;
width: 100%;
overflow: hidden;
padding: 0pt;
margin: 0pt;
}
ul.menu-nav li
{
float: left;
background: url('../images/menu-divider.gif') repeat-y scroll right center transparent;
}
ul.menu-nav li a
{
color: rgb(255, 255, 255);
display: block;
font: bold 12px/18px Tahoma,Geneva,sans-serif;
text-decoration: none;
padding: 9px 31px 14px 30px;
}
ul.menu-nav li a:hover, ul.menu-nav li.active a
{
color: rgb(77, 26, 2);
}

Interpretacja przeglądarki

<div id="topmenu">
div class="right-bottom-bg">
<div class="left-bottom-bg">
ul class="menu-nav"> <li class="item5">
<a href="http://localhost/Joomla/index.php?option=com_user&view=register&Itemid=5">
<span>Strona1</span>
</a>
</li>
<li id="current" class="active item6">
<a href="http://localhost/Joomla/index.php?option=com_user&view=login&Itemid=6">
<span>Strona2</span>
</a>
</li>
<li class="item7">
<a href="http://localhost/Joomla/index.php?option=com_virtuemart&Itemid=7">
<span>Strona3</span>
</a>
</li>
</ul>
</div>
</div>
</div>


Sytuacja wygląda tak że w tym co napisałem aktywny link jest "strona2" i tak pozostaje nawet przy przejściu na strone 1 lub 3


przy innej konfigóracji modułu top menu aktywny link zamraża się na "strona1" a przy wyłączeniu krutkich adresów to wogóle nie działa aktywny link.
Czy ktoś pomoże mi to rozwiązać? Bo ja jóż nie wiem czy to błąd kodu czy Joomla :(

naszemiasto
01-04-2012, 12:02
zamiast tych kodów podaj link do strony - będzie zdecydowanie łatwiej Ci pomóc(nieakualne - widzę że masz instalację na localhost)

ramiro
01-04-2012, 14:40
Poczytaj sobie o odsyłaczach odwiedzonych (http://www.kurshtml.edu.pl/css/odsylacz_odwiedzony,pseudoklasy.html).
Polecam stosować na początek program KED mimo, iż chyba już nie jest wspierany będzie Ci prościej.

---------- Post dodany o 14:40 ---------- Poprzedni post był o 14:34 ----------

Musisz dopisać w kodzie CSS


.menu-nav li a:visited
{
color: #c60000;
}


Oczywiście kolor wybierz sobie jaki tam tylko chcesz.

naszemiasto
01-04-2012, 15:11
@ramiro - to co podałeś dotyczy linków odwiedzonych - a problemem są linki aktywne.
Kolega ma utworzoną klasę odpowiadającą za te linki:

ul.menu-nav li a:hover, ul.menu-nav li.active a { color: rgb(77, 26, 2); } jednakże nie działa ona. Rozwiązań tego problemu może być kilka - bez obejrzenia tej strony ciężko jest powiedzieć gdzie leży problem.

raffiks
01-04-2012, 15:16
Hej, niestety ramiro ale nie chodzi tu kolor odsyłaczy odwiedzonych, tego elementu nie ma być w tym menu bo by to brzydko wyglądało. Co do edytora to używam Pajączka jakoś tak jestem do niego przyzwyczajony. Chodzi o taki efekt jak np. na tej stronie forum Menu główne na niebieskim pasku u góry po lewej. Jak jestem na forum to się podświetla zakładka "Forum" a jak przejdę do regulaminu to podświetli się zakładka "Regulamin" a zakładka "forum" wróci do formatu reszty zakładek itd. Sprawa jasna jak słońce tylko czemu nie działa?

ramiro
01-04-2012, 20:47
Oj coś zamieszałem, myślałem o hover napisałem visited, chyba za długo siedzę przy komputerze :)
Usuń a:hover, który masz zdefiniowany, zastąp go oddzielnym wpisem:

.menu-nav li a:hover
{
color: #c60000;
}


Co do edytora to używam Pajączka jakoś tak jestem do niego przyzwyczajony.
Rozumiem, mimo wszystko na początek poleciłem go ze względu na ściągę funkcji, którą posiada. O wiele szybciej się uczy.