Page 1 of 1

Zwei Menüs mit unterschiedlichen CSS

Posted: Mon Dec 05, 2011 11:00 am
by karo
Noch eine Frage. Ich möchte zwei Menüs auf einer Seite unterbringen. Die beiden sind unabhängig voneinander. Jedoch greifen beide auf die selben CSS zu. Ich möchte aber für das zweite neue CSS definieren. Wie kann ich das machen?

Danke
Karo

Re: Zwei Menüs mit unterschiedlichen CSS

Posted: Mon Dec 05, 2011 12:19 pm
by marcus
Vorab erstmal: man kann zwar mehrere WebYep-Menü-Elemente auf einer Seite verwenden, muss aber unbedingt darauf achten, dass beide unterschiedliche Sprungziele haben!

Bezüglich CSS: die einfachste Möglichkeit wäre, die beiden Menüs in Container mit unterschiedlichen Klassen/IDs zu platzieren. Dann kann man mit dem entsprechenden Selektor die beiden unterscheiden.

Ein kleines Beispiel dazu:
Menü #1 soll ein waagrechtes Hauptmenü sein. Wir packen es also in ein <div> mit der Klasse "hmenu".
Menü #2 soll ein senkrechtes Untermenü werden und bekommt daher einen <div>-Container Namens "vmenu".

Im Stylesheet würden die Selektoren dann so aussehen:

Code: Select all

.hmenu ul.WebYepMenu {...}
.hmenu .WebYepMenuItem {...}

.vmenu ul.WebYepMenu {...}
.vmenu .WebYepMenuItem {...}

Re: Zwei Menüs mit unterschiedlichen CSS

Posted: Mon Dec 05, 2011 2:38 pm
by karo
Vielen Dank, das hat prima funktioniert.

Re: Zwei Menüs mit unterschiedlichen CSS

Posted: Fri Jan 13, 2012 6:09 pm
by ISS-JS
Hallo Marcus,

ich suche schon seit längerem nach einer Lösung, ein mit Webyep bearbeitbares waagerechtes (horizontales) Menü zu erstellen.

Hast Du da schon einen CSS-Code? Kannst Du mir da was zukommen lassen? Ich bräuchte eines, das die 2te Ebene dann vertikaleinblendet und die 3te Ebene (und folgend) jeweils nach rechts ausklappt.

Das wäre super.

Danke im Voraus

Jürgen

Re: Zwei Menüs mit unterschiedlichen CSS

Posted: Fri Jan 13, 2012 7:00 pm
by marcus
ISS-JS wrote:ich suche schon seit längerem nach einer Lösung, ein mit Webyep bearbeitbares waagerechtes (horizontales) Menü zu erstellen.
... Ich bräuchte eines, das die 2te Ebene dann vertikaleinblendet und die 3te Ebene (und folgend) jeweils nach rechts ausklappt.

Ich habe vor etwa einem Jahr im englischen Forum ein Beispiel dazu gepostet (einmal als reines HTML und einmal als WebYep-Seite).

Generell muss ich dazu sagen, dass horizontale Menüs nicht trivial zu implementieren sind (der defekte IE z.B. hat mir mehr als nur ein paar graue Haare beschert). Ein gutes Verständnis von CSS ist unabdingbare Voraussetzung dafür, sowas zu implementieren oder anzupassen.
Ich kann zwar nicht für jeden Anwender der mich danach fragt solch ein Menü basteln (dann täte ich nichts anderes mehr bis zum Jahre Schnee :lol:), aber das oben genannte Beispiel ist durchgängig kommentiert und kann als Ausgangspunkt für weitere Experimente dienen.

Einfachere Beispiele befinden sich auch auf unserer Tutorials & Examples Seite (nur auf Englisch verfügbar).