LinkBack URL
About LinkBacksHallo Leutz,
lässt sich das mit den Class Sufixxen denn nachrüsten ?
Ich habe zu diesem Thema schon hier gepostet.
MFG blueice_haller
Schade -.-
Hallo Leutz,
lässt sich das mit den Class Sufixxen denn nachrüsten ?
Ich habe zu diesem Thema schon hier gepostet.
MFG blueice_haller
MfG blueice_haller
War meine Antwort hilfreich, so klicke bitte auf den [Danke]-Button.
Titel durch Klicken hinzufügen
Fischers Fisch frisst frischen Fritz, frischen Fritz frisst Fischers Fisch
Hallo!
Das mit den suffixen hab ich mittlerweile hinbekommen. Problem besteht aber jetzt darin, dass jedes Menüitem eine andere Grafik/Hover haben soll. Die class suffix spricht aber leider dann alles weiteren Links gleich an, bzw das gesamte Menümodul...irgendwelche Ideen?
Tutorial: Menü stylen mit hover
Hallo Jongenz,
ich hab momentan eine etwas komplizierte Methode. Ich hoffe, dass es bald eine einfachere Methode geben wird.
Diese ist nur für Seiten zu empfehlen, bei der sich das Menü nicht jede Woche ändert.
Auch sollte man das ganze erst lokal mit XJ! durchspielen, bevor man es produktiv einsetzt.
1. Menüs
Ich erstelle für jeden Menüpunkt, der nicht das selbe Bild bekommen soll im Menümanager ein eigenes Menü wie z.B. Home, Kontakt Impressum etc..
In diese verschiebe ich dann Punkte wie Home (Component - FrontPage).
2. Module
Im Modulmanager wird für die Menüs automatisch ein eigenes Modul erstellt.
Ich stelle im Modul Home dann bei "Show title" -> No, "Published" -> Yes, "Menu Class Suffix" -> -Home ein.
Danach lege ich noch die gewünschte Reihenfolge fest.
3. CSS
Ich öffne das Stylesheet und dupliziere folgende Klassen und IDs:
a.mainlevel:link, a.mainlevel:visited sowie a.mainlevel:hover und #active_menu.
Diese habe ich in meinem fall folgendermaßen definiert:
Bei den anderen sollte man den Code entsprechend der "Menu Class Suffix" wie in diesem Fall -Home anpassen.PHP-Code:a.mainlevel-Home:link, a.mainlevel-Home:visited {
background : url(../images/menu.home.normal.gif) no-repeat;
/* Das Bild für "Home" */
color : #fff; /* Die Schriftfarbe */
... /* Es folgen die restlichen Definitionen */
}
a.mainlevel-Home:hover {
background : url(../images/menu.home.hover.gif) no-repeat;
color : #afafaf;
...
}
#active_menu-Home {
background : url(../images/menu.home.active.gif) no-repeat;
color : #ffff33;
...
}
Wenn man sich sicher ist, dass alles stimmt, kann man seine Seite nun aufrufen und schauen, ob alles korrekt funktioniert.
Ob das ganze auch bei Sublevel funktioniert, weiß ich nicht, da ich in diesem Projekt keine Untermenüs benötige.
Auf Anfrage kann ich auch gerne Screenshots erstellen.
MFG blueice_haller
MfG blueice_haller
War meine Antwort hilfreich, so klicke bitte auf den [Danke]-Button.
Titel durch Klicken hinzufügen
Fischers Fisch frisst frischen Fritz, frischen Fritz frisst Fischers Fisch
Hey! Erstmal vielen Dank!
Sry, hatte meinenPostnicht gebookmarket...tztz ;-)
Wers nacher mal testen!
Naja, ich bin da eher Pragmatiker. Wenn es nicht anders geht, und man es unbedingt so realisieren will, dann geht auch das. Selbst wenn es der reinen Lehre eines CMS etwas widerspricht.Zitat von Alan
da vermisse ich ein ""
Um ehrlich zu sein, ich habe mich noch nicht damit beschäftigt, ob und wie man einem Menüpunkt eine bestimmte Grafik zuordnen kann. Da man aber in die Titelzeile im Backend HTML Code schreiben kann, sollte da was zu machen sein.
Einen kleinen Tip noch für den Hovereffekt des Beispiels habe ich aber noch. Zwar nicht ganz Standardkonform...Pragmatismus halt. Viele Browser wie Opera und Firefox unterstützen bereits die CSS3 Eigenschaft opacity. Natürlich können die Internet Explorer das nicht. Aber dafür haben die einen gleichwertigen hauseigenen Filter dabei. Das würde dann in etwa so aussehn:
Damit erspart man sich das Laden einer weiteren Grafik für den Hover.Code:.linkname a { ...weitere Definitionen... opacity: 0.8; filter: alpha(opacity=80); } .linkname a:hover { ...weitere Definitionen... opacity: 1; filter: alpha(opacity=100); }
uiuiui....Leute...
Hab grad erst die Fortführung des threads gelesen...sorry
@blueice: Man kann sich das Leben auch schwer machen
@Jongenz:
Besorge Dir eine Menü-Extension wie extended menu.
Dort wird jedem Menü Item eine individuelle Klasse zugeordnet.
Du brauchst dann nur noch für diese Klassen die entsprechenden Hintergrundbilder zu definieren mit den entsprechenden Hover-Effekten. Das wars.
Alan
Ich reagiere nur auf Fragen, deren Lesbarkeit keine Zumutung darstellt
JUG-im-Pott (Joomla-User-Group)
und ebenfalls "no Artisteer support"
Diesem Tipp bin ich auch gefolgt
Jetzt habe ich aber folgendes Problem: Ich will nicht JEDEM Menü-Item eine unterschiedliche Hintergrundgrafik zuweisen, sondern teilweise gruppieren, d.h. ich brauche folgende Unterscheidungen:
Erster Menüpunkt
Letzter Menüpunkt
alle übrigen Mainlevel-Punkte
alle Sublevel-Ebene1-Punkte
alle Sublevel-Ebene2-Punkte
Wie bekomme ich das hin, ohne wirklich für JEDEN Menüpunkt einzeln eine CSS-Zuweisung machen zu müssen?
Soo, ich nochmal :-)
Hab jetzt das extended menu erfolgreich ans laufen gebracht.
Jetzt stellt sich mir das Problem mit den verschiedenen Grafiken für die einzelnen Menü Items und deren Ids...hoffe da kann jemand helfen?!
a#menulink_1 { padding & so; menübild; }
a#menulink_2 { padding & so; menübild; }
a#menulink_3 { padding & so; menübild; }
a#menulink_4 { padding & so; menübild;}
a#menulink_1:hover { padding & so; hovermenübild; }
a#menulink_2:hover { padding & so; hovermenübild; }
a#menulink_3:hover { padding & so; hovermenübild; }
a#menulink_4:hover { padding & so; hovermenübild; }
Benjamin Weigl, Webentwicklung & Designhttp://benjamin-weigl.de
~kein Joomla Support mehr~
In die menu.css?
Wo muss ich welche weiteren Einstellungen mach?
Sry stell mich grad "etwas" doof an...
Berechtigungen
Zitieren
Lesezeichen