Hallo,
ich baue gerade ein freecssdropdown-Menü um. Es handelt sich um ein TMENU mit zwei Ebenen welches bei der ersten und zweiten Ebene horizontal angeordnet ist. Ich möchte hierbei immer die zweite Ebene auf der sich die gerade aktive Seite befindet eingeblendet lassen wegen der Usability. Wenn der Mauszeiger aber über einen anderen Menüpunkt der ersten Ebene geht, soll von diesem Menüpunkt die zweite Ebene eingeblendet werden (über der gerade aktiven Ebene). Dazu habe ich einfach verschiedene Klassen vergeben und diese über CSS formatiert. Klappt auch eigentlich...
Einziger Punkt ist, das der z-index aller zweiter Ebenen gleich ist. Sprich jeder Menüpunkt, der im xHTML-Quelltext weiter unten kommt, überdeckt die vorhergehenden Punkte. Dazu müsste ich dem UL-Tag, in welchem die gerade aktive Seite ist eine eigene Klasse mitgeben (damit ich den z-index ändern kann). Leider habe ich keine Ahnung, wie ich das abrufen kann, da der wrap mit dem UL-Tag ja ausserhalb der Menüzustände erfolgt...
Hier mal mein TS:
plugin.freeCssDropDownMenu.horizontal >
plugin.freeCssDropDownMenu.horizontal = HMENU
plugin.freeCssDropDownMenu.horizontal {
special = directory
special.value = 34
#excludeUidList = 35
if {
value = 1
equals = 1
}
1 = TMENU
1 {
wrap = <ul class="dropdown dropdown-linear dropdown-columnar"> | </ul>
expAll = 1
noBlur = 1
NO = 1
NO {
ATagTitle.field = abstract // description // subtitle // title
wrapItemAndSub = <li> | </li>
stdWrap.htmlSpecialChars = 1
}
IFSUB < .NO
IFSUB {
wrapItemAndSub = <li class="dir"> | </li>
}
CUR < .NO
CUR {
wrapItemAndSub = <li class="act-cat"> | </li>
}
CURIFSUB < .NO
CURIFSUB {
wrapItemAndSub = <li class="act-cat-dir"> | </li>
}
ACTIFSUB < .NO
ACTIFSUB {
wrapItemAndSub = <li class="act-cat-sub"> | </li>
}
}
2 < .1
2.wrap = <ul> | </ul>
2.CUR.wrapItemAndSub = <li class="act-page"> | </li>
3 < .2
4 < .2
5 < .2
}
lib.nav.20 < plugin.freeCssDropDownMenu.horizontal
Hat jemand eine Ahnung, wie ich den UL-Tag der zweiten Ebene nur für die aktive Ebene ändern kann?
Hier wär noch der von Typo3 ausgespuckte HTML-Quelltext:
<ul class="dropdown dropdown-linear dropdown-columnar">
<li>
<a title="Home" target="_self" href="http://domain.de/">Home</a>
</li>
<li class="dir">
<a title="Kontakt" target="_self" href="kontakt.html">Kontakt</a>
<ul>
<li>
<a title="Einkauf Buchhaltung" target="_self" href="kontakt/einkauf-buchhaltung.html">Einkauf Buchhaltung</a>
</li>
<li>
<a title="Technik" target="_self" href="kontakt/technik.html">Technik</a>
</li>
<li>
<a title="Verkaufsinnendienst" target="_self" href="kontakt/verkaufsinnendienst.html">Verkaufsinnendienst</a>
</li>
<li>
<a title="Vertrieb" target="_self" href="kontakt/vertrieb.html">Vertrieb</a>
</li>
</ul>
</li>
<li class="act-cat-sub">
<a title="Service" target="_self" href="service.html">Service</a>
<ul>
<li>
<a title="Anfahrt" target="_self" href="anfahrt.html">Anfahrt</a>
</li>
<li class="act-page">
<a title="Downloads" target="_self" href="downloads.html">Downloads</a>
</li>
<li>
<a title="Richtlinien" target="_self" href="richtlinien.html">Richtlinien</a>
</li>
</ul>
</li>
<li class="dir">
<a title="Leistungen" target="_self" href="leistungen.html">Leistungen</a>
<ul>
<li>
<a title="Weiterverarbeitung" target="_self" href="leistungen/weiterverarbeitung.html">Weiterverarbeitung</a>
</li>
<li>
<a title="Rollenoffset" target="_self" href="leistungen/rollenoffset.html">Rollenoffset</a>
</li>
<li>
<a title="Bogenoffset" target="_self" href="leistungen/bogenoffset.html">Bogenoffset</a>
</li>
<li>
<a title="Vorstufe" target="_self" href="leistungen/vorstufe.html">Vorstufe</a>
</li>
</ul>
</li>
<li class="dir">
<a title="Unternehmen" target="_self" href="unternehmen.html">Unternehmen</a>
<ul>
<li>
<a title="Verbundene Unternehmen" target="_self" href="unternehmen/verbundene-unternehmen.html">Verbundene Unternehmen</a>
</li>
<li>
<a title="Ausbildung" target="_self" href="unternehmen/ausbildung.html">Ausbildung</a>
</li>
<li>
<a title="Jobs" target="_self" href="unternehmen/jobs.html">Jobs</a>
</li>
<li>
<a title="Umwelt Qualität" target="_self" href="unternehmen/umwelt-qualitaet.html">Umwelt Qualität</a>
</li>
<li>
<a title="Portrait" target="_self" href="unternehmen/portrait.html">Portrait</a>
</li>
</ul>
</li>
</ul>
Danke im voraus,
Huaba