PDA

Zobacz pełną wersję : menu jako lista - problem?



morphic
16-12-2009, 23:39
Zaciekawił mnie następujący temat.

W szablonach generowanych przez Artisteer menu jest z reguły automatem umieszczane pod bannerem w pozycji user3 (wiem, że może być w każdej innej).
Wówczas jest ono traktowane jako główne menu strony.

Problem zaczyna się pojawiać, gdy ustawimy w Joomli aby aktywne kategorie w menu były podświetlone. Jeśli dana pozycja menu ma podpozycje to jeszcze pół biedy, bo podświetla się pozycja nadrzędna.

Ale... No właśnie. Jeśli mamy gdzieś indziej na stronie menu w postaci listy, to po wybraniu danej pozycji z tej listy nie da rady jej podświetlić. Pozostaje natomiast w trybie active ostatnio wybrany element głównego menu.

Po kombinacjach w CSS szablonu we właściwościach tej listy można ustawić np. aby po najechaniu myszą nad dany link na liście podświetlał się on (hover). Natomiast za żadnego diabła nie daje rady ustawić active dla takiej listy.

Oto fragment kody CSS odpowiedzialny za wyświetlanie takiej listy:

.art-BlockContent-body a:link
{
color: #2B78A1;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
}

.art-BlockContent-body a:visited, .art-BlockContent-body a.visited
{
color: #60899F;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
text-decoration: none;
}

.art-BlockContent-body a:hover, .art-BlockContent-body a.hover
{
color: #fff;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
text-decoration: none;
}
.art-BlockContent-body a:active, .art-BlockContent-body a.active
{
color: #fff;
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
text-decoration: none;
}
.art-BlockContent-body ul
{
list-style-type: none;
color: #3B5563;
margin:0;
padding:0;
}

.art-BlockContent-body li
{
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
font-size: 12px;
}

.art-BlockContent-body ul li
{
padding:0px 0 0px 26px;
background-image: url('../images/BlockContentBullets.png');
background-repeat:no-repeat;
margin:0.5em 0 0.5em 0;
line-height:1.2em;
}

.art-BlockContent-body ul li:hover
{

background-color: #2B78A1;
color: #fff;
}

.art-BlockContent-body ul li:active
{
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
text-decoration: none;
background-color: #2B78A1;

Znaczniki hover i active wstawione przeze mnie.

Ma ktoś jakiś pomysł w tej kwestii?