Implementation des DHTML Menüs von brainjar.com

Übermittlung Ihrer Stimme...
Noch nicht bewertet. Seien Sie der Erste, der diesen Artikel bewertet!
Klicken Sie auf den Bewertungsbalken, um diesen Artikel zu bewerten.

Implementation des DHTML Menüs von brainjar.com mit typoscript ( So schauts aus )

 

Auf der Brainjar Webseite www.brainjar.com aus "Revenge of the Menu Bar" das Javascript und das CSS herunterladen und unter "fileadmin/brainjarmenu.js" bzw fileadmin/brainjarmenu.css" speichern.

 

Im Setup folgendes eintragen:

 

# --- 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:80%;">|</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>
  }
   
  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>
  }
  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">&#9654;</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 ---

# Default PAGE object:
page = PAGE
page.typeNum = 0
page.10 < temp.brainjarmenu
page.headerData.1 = TEXT
page.headerData.1.value = <SCRIPT LANGUAGE="JavaScript" SRC="fileadmin/brainjarmenu.js"></SCRIPT>
page.headerData.2 = TEXT
page.headerData.2.value = <link href="fileadmin/brainjarmenu.css" rel="stylesheet" type="text/css" />

 

Dieses Snippet wurde von Peter Klein eingesendet.



Comments


Marc, 14-09-09 14:27:
Danke! So etwas habe ich schon so lange gesucht! Ihr seid meine Rettung!!!!!!!
Tim, 23-09-09 11:54:
Wie binde ich das Menü 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" />

Kommentar hinzufügen

* - Pflichtfeld

*



*
*

Top 10 Updates

Nützliche Links geändert am  24-Apr-2013 06:31:02
Login geändert am  09-Sep-2010 09:31:35
Schöne Schriften mit Google Font API geändert am  20-Mai-2010 14:36:59
TS basierte Searchbox für Indexed Search geändert am  18-Mai-2010 16:26:54
TYPO3 SEO geändert am  30-Apr-2010 07:43:20
Suchmaschinenfreundliche grafische Überschriften in TYPO3 geändert am  30-Apr-2010 07:33:56
Erstellen eines einfachen Infocenters mit TYPO3  geändert am  17-Nov-2009 11:11:22
Funktionierendes Section Menu mit TemplaVoila geändert am  05-Mai-2009 10:42:40
"Nicht im Menü" in Sitemap anzeigen geändert am  05-Mai-2009 10:12:24
Implementation des DHTML Menüs von brainjar.com  geändert am  01-Feb-2009 13:01:36

Latest comments

22-Apr-2016 07:20:42
Stephan schrieb: Perfekt wäre es, wenn man dieses Beispiel für TYPO3 7.x ummünzen könnte.
Einfache Bildergalerie aus dem media Feld
12-Apr-2016 17:05:49
Peter schrieb: habs... Einfach noch 10.renderObj.header.10 = 10.renderObj.textpic.10 = ...
Andere Formatierung für erstes Element in TYPO3
12-Apr-2016 16:36:46
Peter schrieb: Wunderbar, auch wenn der Eintrag schon nen bisschen älter ist... .. klappt soweit T3...
Andere Formatierung für erstes Element in TYPO3
English
Suche: