Hallo liebe Typo3-Forenbesucher,
wie binde ich das Menü von
http://www.typo3wizard.com/de/snippets/menus/implementation-des-dhtml-menues-von-brainjarcom.html
in folgendes Template ein:
page = PAGE
page.typeNum = 0
page.stylesheet = fileadmin/styles.css
page.20 = TEMPLATE
page.20 {
template = FILE
template.file = fileadmin/vorlage.html
workOnSubpart = document
subparts.inhalt < styles.content.get
subparts.LAST_CHANGE = TEXT
subparts.LAST_CHANGE.field = tstamp
subparts.LAST_CHANGE.strftime = %d.%m.%y, um %H:%M
subparts.LAST_CHANGE.wrap = |
subparts.navigation = TEXT
subparts.navigation.wrap = <div class="menuBar" style="width:100%;">|</div>
}
page.headerData = COA
page.headerData.1 = TEXT
page.headerData.1.value = <script type="text/javascript" src="fileadmin/drucken.js"></script>
page.headerData.2 = TEXT
page.headerData.2.value = <script type="text/javascript" src="fileadmin/brainjarmenu.js"></script>
page.headerData.3 = TEXT
page.headerData.3.value = <link rel="stylesheet" media="print" href="fileadmin/druckvorschau.css" type="text/css" />
Ich freue mich auf eure Antworten und bedanke mich im Voraus!
Marc
Hallo,
Das temp.brainjarmenu ganz am Anfang, dann einfach einen subpart dafür im template definieren und
subparts.menu < temp.brainjarmenu
georg
Hey Georg!
Vielen lieben Dank! Wow, so einfach ist das!
Es klappt wunderbar!
Warum bin ich da nicht selbst drauf gekommen? #angry#
Is ja eigentlich logisch, dass ich das mit dem subpart löse...
Gruß
Marc
Hallo,
es gibt leider immernoch ein Problem mit dem schönen horizontalen Mouseover Aufklappmenü (brainjarmenü).
Es ist gewünscht, dass der aktive Menüpunkt besonders markiert bleibt, damit der User immer weiß, wo er gerade ist.
Klappt super!! - bei einer Ebene, hier hab ich einfach in TS folgende Zeile geschrieben:
CUR.ATagParams = class = "navi_active"
Aber bei den Punkten, die Unterpunkte haben, soll nur der Oberpunkt "besonders markiert" bleiben!
Der aktive Unterpunkt nicht, denn der verschwindet ja. --> Braucht man nicht, weil der User das nur sehen würde, wenn er das Menü wieder aufklappen würde (mit Maus drüber fahren würde), außerdem sieht's bei den Untermenüs blöd aus, hab's schon ausprobiert.
Also wie krieg ich das hin, dass der Oberpunkt wie bei den Punkten ohne Untermenü "besonders markiert" bleibt?
Ich hoffe, es ist klar was ich will.
Für eure super Unterstützung vielen Dank im Voraus!
Hier der relevante Teil meines TypoScripts:
# --- Brainjar menu begin ---
temp.brainjarmenu = COA
temp.brainjarmenu {
# ---------------------------------------
# Typoscript implementation of the DHTML
# menu found at http://www.brainjar.com
# ---------------------------------------
10 = HMENU
10.entryLevel = 0
10.1 = TMENU
10.1 {
wrap = <div class="menuBar" style="width:100%;">|</div>
NO.ATagParams = class="menuButton"
IFSUB = 1
IFSUB.doNotLinkIt = 1
IFSUB.subst_elementUid = 1
IFSUB.allWrap = <a class="menuButton" href="#" onclick="return buttonClick(event, 'menu{elementUid}');" onmouseover="buttonMouseover(event,'menu{elementUid}');">|</a>
CUR < .NO
CUR = 1
CUR.ATagParams = class = "navi_active"
}
20 < .10
20.1 >
20.1 = TMENU
20.1 {
expAll = 1
NO.doNotLinkIt = 1
NO.doNotShowLink = 1
IFSUB < .NO
IFSUB = 1
IFSUB.subst_elementUid = 1
IFSUB.allWrap = <div id="menu{elementUid}" class="menu" onmouseover="menuMouseover(event)">|
IFSUB.wrapItemAndSub = |</div>
CUR < .NO
CUR = 1
CUR.ATagParams = class = "navi_active"
}
20.2 = TMENU
20.2 {
NO.ATagParams = class="menuItem"
IFSUB = 1
IFSUB.doNotLinkIt = 1
IFSUB.subst_elementUid = 1
IFSUB.allWrap = <a class="menuItem" href="#" onclick="return false;" onmouseover="menuItemMouseover(event,'menu{elementUid}');"><span class="menuItemText">|</span><span class="menuItemArrow"><img src="fileadmin/pfeil.png"></span></a>
SPC = 1
SPC.doNotLinkIt = 1
SPC.doNotShowLink = 1
SPC.allWrap = <div class="menuItemSep"></div>
}
30 < .10
30.1 >
30.1 = TMENU
30.1 {
expAll = 1
NO.doNotLinkIt = 1
NO.doNotShowLink = 1
}
30.2 < .20.1
30.3 < .20.2
40 < .10
40.1 >
40.1 < .30.1
40.2 < .30.1
40.3 < .20.1
40.4 < .20.2
50 < .10
50.1 >
50.1 < .30.1
50.2 < .30.1
50.3 < .30.1
50.4 < .20.1
50.5 < .20.2
}
# --- Brainjar menu end ---
Falls es jemanden interessiert.
Nun bleiben die Oberpunkte "hervorgehoben"
Hier die Lösung:
Im Template
10 = HMENU
10.entryLevel = 0
10.1 = TMENU
10.1 {
wrap = <div class="menuBar" style="width:100%;">|</div>
NO.ATagParams = class="menuButton"
IFSUB = 1
IFSUB.doNotLinkIt = 1
IFSUB.subst_elementUid = 1
IFSUB.allWrap = <a class="menuButton" href="#" onclick="return buttonClick(event, 'menu{elementUid}');" onmouseover="buttonMouseover(event,'menu{elementUid}');">|</a>
CUR < .NO
CUR = 1
CUR.ATagParams = class="navi_active"
ACTIFSUB = 1
ACTIFSUB.doNotLinkIt = 1
ACTIFSUB.subst_elementUid = 1
ACTIFSUB.allWrap = <a class="menuButton" id="navi_active" href="#" onclick="return buttonClick(event, 'menu{elementUid}');" onmouseover="buttonMouseover(event,'menu{elementUid}');">|</a>
}
und im CSS meine styles für "navi_active" nochmal über id also mit # definiert:
#navi_active
{
...
}
HAllo,
ich durchsuche schon seit einiger Zeit das Netz nach Flyout Menüs mit Mouseover und glaube, das hier könnte funktionieren.. aber wo hast du denn die Dateien von brainjarcom her? Ich finde da keine CSS und java Datei zum downloaden.. nur viiiieeeeeeeeeeeeeeel Code #paralyzed#