Linkfarbe css

[enni]

Hallole,

eine "dumme Frage" - Wie erreiche ich es, dass auf der aktuellen Seite, auf der ich mich gerade befinde, die Frabe des aufgerufenen Links statt blau (wie der rest des menus) grün ist?

In der css Datei sieht das ganze so aus:

Code:

.menu {
    color: #181B6A;
    font-size: 14px;
    font-weight: bold;
}
.menu a:link {
    color: #181B6A;
    text-decoration:none;
}
.menu a:visited {
    color: #181B6A;
    text-decoration:none;
}
.menu a:hover {
    color: #669900;
    text-decoration:none;
}
.menu a:active {
    color: #669900;
    text-decoration:none;
}

Der Aufruf des Menüs so:

Code:

show_menu2(0, SM2_ROOT, SM2_START, SM2_ALL, '&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;[a][menu_title]</a>', '', '', '', '[a][menu_title]</a>');

Also ganz einfach in einer Reihe:

Startseite | Link1 | Link2 | Link3 ...etc....

Wenn ich z.B. auf der Seite Link2 bin soll dieser grün statt sonst blau sein....irgendwie klappt des net^^

Danke für eure Hilfe

[ruebenwurzel]

Hallo,

aktuell = active. Einfach der klasse "active" grün zuordnen.

Matthias

[Stefek]

Ja, aber da fehlt noch was in der SM2 Aussage:

<a '. "[if(class=menu-current){class=\"active\" }]" .' href="[url]">[menu_title]</a>

Um es so hinzubekommen, müsstest Du, Enni, das SM2 wie folgt aufrufen:

Code:

<?php
show_menu2(0, SM2_ROOT, SM2_START, SM2_ALL, '&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a '. "[if(class=menu-current){class=\"active\" }]" .' href="[url]">[menu_title]</a>', '', '', '', '<a '. "[if(class=menu-current){class=\"active\" }]" .' href="[url]">[menu_title]</a>') ; ?>

Ich habe es nicht geprüft, aber schau mal, ob es so funktioniert und lass mich wissen.

MfG,
Stefek

P.S. Der CSS Selector a:active bezieht sich auf den Moment des Klickens auf den a Link, nicht auf den Zustand "menu-current". Daher  sagen wir in der SM2 Aussage "wenn die Standard-Klasse menu-current ist, dann gib ihm die Klasse 'active' stattdessen".

Nachtrag: um den gleichen Effekt bei a:active und a.active zu haben, müssen die Selectoren hintereinander angelegt werden, bevor die Deklaration kommt:
a:active, a.active {deine declaration}

[dbs]

sieht bei mir so aus:

Code:

#navi ul li a:hover{
    background-color:#ccc;
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#660000;
}
#navi li .menu-current{
        background-color:#ccc;
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#006400;
}

wichtig is ja nur color... hab mal darkgreen(#006400) eingetragen...

Code:

<div id="navi"><?php show_menu2(0, SM2_ROOT, SM2_START+1, false, '<li>[ac][menu_title]</a>', false, false, false); ?></div>

hilft das weiter?

[Stefek]

Dein CSS Beispiel würde tatsächlich dann funktionieren, wenn im SM2 Aufruf [ac] (wie Du es gemacht hast) statt [a] stehen würde.
In diesem Falle werden aber alle links mit den SM2 spezisischen Klassen-Namen im HTML Code ausgegeben.

Generell führen hier viele Wege zum Ergebnis und oft ist es schwer etwas zu Show_menu2 pauschal zu sagen, wenn man nicht das Template drum herum hat und auch nicht weiß, wie die Linkstruktur letzten Endes aussehen soll (die Andordnug der Seiten, Menütiefe, Anzahl verwendeter $menu 's usw. usf.

Was sagst Du Enni.
Hilft überhaupt einer der Tipps hier weiter?

MfG,
Stefek

[enni]

guten abend, sorry für die späte antwort, ich musste etwas länger arbeiten^^
recht herzlichen dank für die zahlreichen antworten - echt nett von euch! ich werde es morgen früh gleich testen und mich wieder melden.

eine gute nacht schon einmal
enni
*wink*

[enni]

Guten Morgen,

aaalso, hab die vorgeschlagenen Sachen mal ausprobiert - so richtig tuts noch nicht. Zum Code:

Den Menüaufruf habe ich wie von Stefek vorgeschlagen geändert in:

Code:

<div align="right" class="menu">
              <?php show_menu2(0, SM2_ROOT, SM2_START, SM2_ALL, '&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a '. "[if(class=menu-current){class=\"active\" }]" .' href="[url]">[menu_title]</a>', '', '', '', '<a '. "[if(class=menu-current){class=\"active\" }]" .' href="[url]">[menu_title]</a>') ; ?>
            </div>

Die css Datei habe ich wie folgt ergänzt:

Code:

.menu {
    color: #181B6A;
    font-size: 14px;

}
.menu a:link {
    color: #181B6A;
    text-decoration:none;
    font-weight: bold;
}
.menu a:visited {
    color: #181B6A;
    text-decoration:none;
    font-weight: bold;
}
.menu a:hover {
    color: #669900;
    text-decoration:none;
    font-weight: bold;
    border-bottom:1px solid #800;
    border-top:1px solid #800;
}
.menu a:active {
    color: #669900;
    text-decoration:none;
    font-weight: bold;
}

.menu .active {
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#006400;
}

Somit wird der Link beim drüberfahren und auch der aktive Link unterstrichen - aber die Farbe ändern klappt leider nicht. Nach anklicken ist der Link immer noch blau

[dbs]

ich hab mal zu testzwecken den menu-current bzw. dein active bei mir auf weiß gesetzt.
nicht, dass wir aneinander vorbeireden..

gelöscht

[enni]

ja genau, so solls sein...verrätst du mir auch wie?

[dbs]

öhm... wenn dir mein code nicht weiterhilft oder du ihn für dich nicht abwandeln kannst, dann sieht's schlecht aus.
für mich ist website baker und css alles neuland.
wenn ich irgendwas machen will beginnt das große suchen und lesen. *g*
aber ich versuche mal das nachzuvollziehen was ich tat und geb dann bescheid(falls niemand schneller ist).

[Stefek]

Schau mal was passiert, wenn Du es so machst.

Code:

.menu a.active {
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#006400;
}

(das "a" vor .active)

Grüße,
Stefek

[enni]

SUUUPER!!!! Genau das war's *freu*

Danke für die Hilfe und einen schönen Tag
Enni

[dbs]

Anschlussfrage: wie kann ich denn einen active wieder ausschließen? Genauer die Home-Seite. der muss nicht markiert sein, wenn man die Seite das erste mal betritt.

[dbs]

*hochschieb*

vielleicht noch jemand einen ansatz wie ich den einen current ausschließen kann?
im moment wird bei hover und current der menülink farblich markiert. und das current möchte ich auf der home-seite ausschließen.
web developer zeigt mir auf der home-seite den markierten home-link so an:
#navi > ul .menu-top > li > a .menu-current menu-first

gruß
dbs

[Stefek]

Hallo.

Poste mal Deinen gegenwärtigen SM2 Aufruf hier. Sowie den CSS Teil des Menüs.

Gruß,
Stefek

[dbs]

wäre prima, wenn du eine idee hättest 

Code:

<div id="navi"><?php show_menu2(1, SM2_ROOT, SM2_CURR+1, false, '<li>[ac][menu_title]</a>', false, false, false); ?></div>

Code:

#navi{
    margin:0px; /*Naviabstand zum linken Rand*/
    margin-top:0px;
    width:135px;
    border-right:3px solid #800;    
    float:left;
}
#navi ul li{
    list-style:none;
    color:#660000;
}
#navi ul ul li {
  padding-left:5px;
  font-size:7pt;
 
}
#navi ul li a{
    display:block;
    padding:5px; /*Abstand zwischen den Men�punkten*/
    border-bottom:1px solid #fff;
    border-top:1px solid #fff;
    font-weight:bold;
    color:#B22222;
}
#navi ul ul li a{
    display:block;
    padding:5px; /*Abstand zwischen den Men�punkten*/
    border-bottom:1px solid #fff;
    border-top:1px solid #fff;
    font-weight:normal;
}
#navi li a:hover{
    background-color:#ccc;
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#660000;
}
#navi li .menu-current{
    background-color:#ccc;
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#660000;
}

[Mux]

Code:

[quote author=dbs link=topic=11260.msg69302#msg69302 date=1224861164]
wäre prima, wenn du eine idee hättest  :-)

#navi li .menu-current{
    background-color:#ccc;
    border-bottom:1px solid #800;
    border-top:1px solid #800;
    color:#660000;
}

[/quote]

versuch's doch mal mit

.menu-top .menu-first 

Damit hab ich's hingekriegt...

Grüße, Mux

[Stefek]

vielleicht noch jemand einen ansatz wie ich den einen current ausschließen kann?

nimmst Du diesen Aufruf statt des von Dir geposteten.

Code:

show_menu2(1, SM2_ROOT, SM2_CURR+1, false, '<li><a '. "[if(id==1){} else {class=\"[class]\"}]" .' href="[url]">[menu_title]</a>', false, false, false);

@Mux:
Ja, dieser Weg ist auch möglich.

Gruß,
Stefek

P.S.
Auch der folgende Aufruf ist gut, wenn man den ersten Link vielleicht ganz anders Stylen will:

Code:

show_menu2(1, SM2_ROOT, SM2_CURR+1, false, '<li><a '. "[if(id==1){class=\"kuckuk\" } else {class=\"[class]\"}]" .' href="[url]">[menu_title]</a>', false, false, false);

Und nicht vergessen: id==1 muss gegebenenfalls angepasst werden, wenn die page_id der Startseite nicht 1 ist.

[Mux]

@Mux:
Ja, dieser Weg ist auch möglich.

oops, Mist, so geht's doch nicht, da dann auch in den Submenus das jeweils erste Item keine Änderung mehr erfährt.

Stefan, hättest du vielleicht Lust,  mal aufzuschlüsseln, was bei deinem ersten Vorschlag genauer passiert. Wäre sehr hildreich, um diese ganzen show_menu2-Funktionen mal genauer zu verstehen...

Grüße
Mux

[Stefek]

OK, ich versuche es mal "aufzuschlüßeln".
Aber bei SM2 hilft wirklich nur, das ganze mal für sich durchzukauen.
Aber dies kann ein kleiner Fingerzeig werden, um in die restliche Doku von SM2 besser einzusteigen.

Also:

<a '. "[if(id==1){class=\"kuckuk\" } else {class=\"[class]\"}]" .' href="[url]">[menu_title]</a>

mit <a öffnen wir den a-Tag.
Da sehen wir dann die ganzen Attribute, die später ins HTML geschrieben werden:
class=
href=
die Dinger in den eckigen Klammern werden später per den gegebenen Umständen interpretiert.

[url] ist selbsterklärend
[class] das sind die SM2 typischen Klassen, die per default rauskommen
mann könnte auch noch das title= Attribut mit reinnehmen. Ebenfalls das target= Attribut.
Dann würde es etwa so aussehen:

<a '. "[if(id==1){class=\"kuckuk\" } else {class=\"[class]\"}]" .' href="[url]" target="[target]" title="[page_title]">[menu_title]</a>

So..
[page_title] und [menu_title] sollten auch selbsterklärend sein.

Jetzt kommen wir zu dem Teil mit der if/else Aussage.
Da steht wörtlich geschrieben: "Wenn id ist gleich 1 gebe class="kuckuk" andernfalls gebe [class] aus (die SM2 default Klassen)."

Viel Spaß.

Gruß,
Stefek

[dbs]

@mux: hab's gemerkt, dass menu-first auch jede erste unterseite betrifft.
wäre ja auch zu schön, wenn es so einfach wäre. trotzdem danke.

@stefek: genial! 
genau so wollte ich es. funktioniert prächtig!
das buch mit sieben sechs siegeln, auch SM2 genannt, hätte ich nie so hinbekommen. wollte gerade mux beipflichten wegen erläuterung, aber du hast es eben beim tippen gepostet. klasse!

besten dank und gruß
dbs