"nested" / verschachteltes vertikales Menü - styling
Eingetragen von aschiwi (1113)am 02.08.2007 - 09:05 Uhr in
Ich gebe die Unterpunkte meiner Primary Links, die horizontal ausgegeben werden, in der linken Seitenleiste vertikal aus. Die Unterpunkte bekommen wieder Unterpunkte, also z.B. so:
Unternehmensgruppe (Primary Link)
- Unternehmen 1 ("expanded")
--- Tätigkeiten Unternehmen 1
--- Mitarbeiter Unternehmen 1
--- Kontakt Unternehmen 1
- Unternehmen 2 ("collapsed")
- Unternehmen 3 ("collapsed")
Drupal löst das so, dass immer die drei classes leaf, expanded oder collapsed vergeben werden und wenn ein Punkt einen Unterpunkt bekommt, dann wird in das "li" ein weiteres "ul" verschachtelt. Die verschachtelten Punkte möchte ich anders gestalten, also z.B. andere Hintergrundfarbe, kleinere Schriftart. Meiner Meinung nach geht das im Moment noch nicht, ich müsste dem verschachtelten Menü (den Unterpunkten) eine weitere class zuordnen können.
Versteht jemand, was ich meine? Gibt es hierzu eine mögliche Lösung?
<ul class="menu">
<li class="leaf"><a href="#" title="Link 1"><span>Link 1</span></a></li>
<li class="leaf"><a href="#" title="Link 2"><span>Link 2</span></a></li>
<li class="expanded"><a href="#" title="Link 3" class="active"><span>Link 3</span></a>
<ul class="menu"> <!-- Hier möchte ich eine weitere class angeben, z.b. class="menu nested" -->
<li class="leaf"><a href="#" title="Link 3.1"><span>Link 3.1</span></a></li>
<li class="leaf"><a href="#" title="Link 3.2"><span>Link 3.2</span></a></li>
<li class="leaf"><a href="#" title="Link 3.3"><span>Link 3.3</span></a></li>
<li class="leaf"><a href="#" title="Link 3.4"><span>Link 3.4</span></a></li>
<li class="leaf"><a href="#" title="Link 3.5"><span>Link 3.5</span></a></li>
</ul>
</li>
<li class="collapsed"><a href="#" title="Link 4"><span>Link 4</span></a></li>
<li class="collapsed"><a href="#" title="Link 5"><span>Link 5</span></a></li>
<li class="leaf"><a href="#" title="Link 6"><span>Link 6</span></a></li>
<li class="leaf"><a href="#" title="Link 7"><span>Link 7</span></a></li>
</ul>Danke
Anja
- Anmelden oder Registrieren um Kommentare zu schreiben
Probier mal das: .expanded
am 02.08.2007 - 09:10 Uhr
Probier mal das:
.expanded .menu {background-color: #000;
}
gruß pebosi
auf sowas schlaues komm ich
am 02.08.2007 - 09:59 Uhr
auf sowas schlaues komm ich natürlich nicht... das hat funktioniert, genial, vielen dank!
Untermenüs
am 05.08.2007 - 17:21 Uhr
die Untermenüs erreichst Du grundsätzlich auch über
ul li ul li {
...
}
Viele Grüße,
Daniel Greitens
www.maximago.de
Hallo Daniel, danke für
am 06.08.2007 - 08:29 Uhr
Hallo Daniel,
danke für die Antwort, das ist auch eine interessante Lösung bzw. wahrscheinlich die bessere :-)
Anja