WebsiteBaker Support (2.8.x) > Diskussion über WB (closed)
Haupt- und Untermenü gleichzeitig als aktiv (menu_current) markiert? Wie?
Rayne:
Hallo.
Ich habe ein Menü nach folgender Struktur:
Hauptpunkt 1
Unterpunkt 1
Unterpunkt 2
Unterpunkt 3
Hauptpunkt 2
.
.
.
Wenn nun Hauptpunkt angeklickt ist, wird er als aktiv markiert. Super. Wenn nun aber noch Unterpunkt 1 angeklickt wird, wird nur dieser Unterpunkt als aktiv markiert, nicht aber der Hauptpunkt. Ich möchte aber, dass immer auch der Hauptpunkt und der jeweilige Unterpunkt als menu_current markiert ist.
Geht das irgendwie?
Danke für jede Hilfe :)
BerndJM:
Hi,
wenn du show_menu2 verwendest, sollte es recht einfach per CSS zu formatieren sein. Denn die jeweiligen Elternelemente erhalten bei aktiviertem Kindelement die Klasse menu-parent.
Aber bitte beachten, daß das menu_current bei SM2 menu-current heißt ;-)
Grüßle Bernd
Rayne:
Danke für den Tip, habe nun SM2 benutzt.
Allerdings bekomme ich es partout nicht auf die Reihe, diese menu-parent und menu-current richtig einzusetzen.
So sieht der von WB generierte Code für meine Navi aus:
--- Code: ---<ul class="menu-top"><li class="menu-expand menu-parent menu-first"><a href="http://localhost/wiko.fhtw-berlin.de" target="_top">Studiengang</a><ul class=""><li class="menu-current menu-first"><a href="http://localhost/wiko.fhtw-berlin.de/pages/studiengang/ueberblick.php" target="_top">Überblick</a></li><li class="menu-sibling"><a href="http://localhost/wiko.fhtw-berlin.de/pages/studiengang/philosophie.php" target="_top">Philosophie</a></li><li class="menu-sibling"><a href="http://localhost/wiko.fhtw-berlin.de/pages/studiengang/ziele.php" target="_top">Ziele</a></li><li class="menu-sibling"><a href="http://localhost/wiko.fhtw-berlin.de/pages/studiengang/inhalte.php" target="_top">Inhalte</a></li><li class="menu-sibling menu-last"><a href="http://localhost/wiko.fhtw-berlin.de/pages/studiengang/projekte.php" target="_top">Projekte</a></li></ul></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/bachelor.php" target="_top">Bachelor</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/master.php" target="_top">Master</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/praktikum.php" target="_top">Praktikum</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/fhtw.php" target="_top">FHTW</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/wiko-family.php" target="_top">WiKo Family</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/downloads.php" target="_top">Downloads</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/kontakt.php" target="_top">Kontakt</a></li><li class=""><a href="http://localhost/wiko.fhtw-berlin.de/pages/links.php" target="_top">Links</a></li><li class="menu-last"><a href="http://localhost/wiko.fhtw-berlin.de/pages/hilfe.php" target="_top">Hilfe</a></li></ul></div>
--- End code ---
Und so der relevante Teil meines Stylesheets:
--- Code: ---#Huelle-Navi {
width: 220px;
height: auto;
margin-left: 20px;
float: left;
display: inline; /* The IE5/6 Doubled Float-Margin Bug */
background: #3e4d55;
color: #fff;
padding-bottom: 32768px; /*equal hight columns*/
margin-bottom: -32768px;
}
#Huelle-Navi ul {
margin: 0 20px 0 50px;
list-style: none;
}
#Huelle-Navi ul ul {
margin: 0 0 0 20px;
list-style: square;
}
#Huelle-Navi a {
display: block;
text-decoration: none;
text-align: right;
font-weight: bold;
color: #fff;
}
#Huelle-Navi ul a {
width: 150px;
padding-top: 10px;
background: url(Bilder/Liste.gif) no-repeat left center;
border-bottom: 1px dashed #667e8b;
font-size: 14px;
}
#Huelle-Navi ul a:hover {
color: #8cca42;
background: url(Bilder/Liste-over.gif) no-repeat left center;
}
#Huelle-Navi ul ul a {
width: 130px;
padding-top: 5px;
background: none;
border-bottom: none;
font-size: 12px;
}
#Huelle-Navi ul ul a:hover {
color: #8cca42;
background: none;
}
#Huelle-Navi ul ul a.menu-current {
color: #8cca42;
background: none;
}
--- End code ---
Mux:
--- Quote from: Rayne on October 20, 2008, 10:47:18 AM ---Allerdings bekomme ich es partout nicht auf die Reihe, diese menu-parent und menu-current richtig einzusetzen.
--- End quote ---
Hallo,
du sagst es ja schon selbst: du musst nur die Angaben, die du für .menu-current gemacht hast, auch noch für das Eltern-Item, also .menu-parent, machen.
Wenn das nicht funktioniert, liegt es vielleicht an den ganzen ul's deiner Hülle-Navi-div. Ich bin zwar ein ziemlicher Anfänger sowohl bei WB als auch bei CSS, aber ich denke, du brauchst die verschiedenen ul-Ebenen nicht mehr gesondert erwähnen, wenn du show_menu2 benutzt. die Klasse .menu-current bspw. kennzeichnet ja genau das eine aktive menu-item, egal in welcher Ebene des Menus du dich befindest. Die Einträge für den aktuellen Menupunkt sollten demnach mit "#Huelle-Navi .menu-current a" zu machen sein.
Grüße, Mux
Rayne:
Danke für deine Antwort, das Problem konnte ich dann doch nooch lösen. hab ganz vergessen, hier bescheid zu geben :)
Trotzdem danke!
Navigation
[0] Message Index
[#] Next page
Go to full version