-
Das Aussehen anpassen
Guten Tag,
ich hab die Erweiterung installiert, ein neues Modul eingebunden. Weiterhin habe ich es auch geschaft es weitgehend anzupassend.
Allerdings habe ich nun das Problem, wenn man auf den Oberpunkt klickt um ihn zu aktivieren, schiebt sich zwar das Untermenü in vollem Umfang auf, aber es werden nicht alle Links angezeigt, obwohl genug platz da ist.
Wenn ich über einen anderen Oberpunkt hover, geht das aktivierte Menü zu, das neue geht auf. Wenn ich den Mauszeiger wieder wegnehme, geht das alte wieder auf und alle Links sind sichtbar.
Hab ich eine einstellung falsch gesetzt oder vielleicht was im CSS falsch angesprochen?
Jan
PS: Hier der CSS code:
Code:
/* Style sheet Navigation */
#left_main_navi
{
width:260px;
height:466px;
left:50px;
top:160px;
position:absolute;
display:block;
background-image:url("tl_files/THEME/theme/NaviBox.png");
background-repeat:no-repeat;
}
#left_main_navi a.submenu,
#left_main_navi li.nosubmenu a
{
position:relative;
margin-left:-25px;
padding:6px 200px 6px 25px;
font-family:Trebuchet MS;
font-weight:bold;
text-decoration:none;
font-size:13px;
color:#bababa;
}
#left_main_navi li.nosubmenu
{
font-family:Trebuchet MS;
font-weight:bold;
text-decoration:none;
font-size:13px;
color:#bababa;
}
#left_main_navi .level_1 p.active
{
margin-top:-6px;
margin-bottom:-6px;
margin-left:-25px;
padding:6px 170px 6px 25px;
background-image:url("tl_files/THEME/theme/active.png");
font-family:Trebuchet MS;
font-weight:bold;
text-decoration:none;
font-size:13px;
color:#ffffff;
}
#left_main_navi ul{
width:210px;
left:0;
top:-12px;
position:relative;
display:block;
margin-left:3px;
list-style-type:none;
}
#left_main_navi .level_1 li
{
width:225px;
left:-40px;
position:relative;
padding-top:6px;
padding-bottom:6px;
padding-left:25px;
border-bottom:1px dotted #fcad35;
}
#left_main_navi li.active
{
height:100px;
}
#left_main_navi .level_1 li:hover
{
padding-top:6px;
padding-bottom:6px;
background-image:url("tl_files/THEME/theme/hover.png");
font-family:Trebuchet MS;
font-weight:bold;
text-decoration:none;
font-size:13px;
color:#ffffff;
}
#left_main_navi .level_2 li
{
width:150px;
top:30px;
position:relative;
margin-top:-10px;
margin-bottom:-10px;
padding:10px;
border-bottom:1px dotted #ffffff;
font-family:Trebuchet MS;
text-decoration:none;
font-size:12px;
color:#bababa;
}
#left_main_navi .level_2 li.first
{
border-bottom:1px dotted #ffffff;
}
#left_main_navi .level_2 a
{
font-family:Trebuchet MS;
font-weight:bold;
text-decoration:none;
font-size:12px;
color:#bababa;
}
#left_main_navi .level_2 li:hover,
#left_main_navi .level_2 li.active
{
background-image:url("tl_files/THEME/theme/hove_submenu.png");
}
-
Es ist "Absicht" dass das aktive Menü beim öffen eines anderen geschlossen wird. Es kann (im Normalfall) immer nur ein Akkordion geöffnet sein.
-
Das ist mir bewusst, ansonsten bräuchte man kein Accordion.
Eventuell habe ich mich falsch ausgedrückt gehabt.
Mein Problem bestand darin das das Untermenü zu knapp bemessen war. Das heißt die Punkte verschwanden nach unten hin und ich habe nicht verstanden wieso.
Das ist aber mit einer anpassung des .level_2 abgeschafft worden.
Das kuriose was ich daran nicht verstanden habe war:
1. Du klickst einen Menüpunkt an mit einem Untermenü.
2. Das Untermenü öffnet sich aber es fehlen links (weil zu klein)
3. Man hovert über ein anderes Menü mit Unterpunkten, aktiviert es aber nicht.
4. Man nimmt den Hover wieder weg, sodass das aktive Untermenü wieder sichtbar wird, diesmal mit allen Links.
Dieses Problem hatte ich und verstand es nicht.
Vielleicht hilfreich für andere:
#MENÜNAME .level_1 li.active.submenu
damit kann man die Fläsche ansprechen die sich öffnet wenn das Untermenü aufgeht.