TYPO3 Typoscript Menü Snippets Überblick

 

YP Slideout Menü (Horizontal)

# include ypMenu script
page.includeLibs.ypMenu = fileadmin/php/ypmenu.php

temp.popupMenu >
temp.popupMenu = HMENU
temp.popupMenu{
	1 = GMENU
	1 {
  		IProcFunc = user_menu->firstLevel
  		expAll = 1
  		wrap = <div id="ypmenu"><ul id="menuO">|</ul></div>
  		relativeToTriggerItem = 1

		NO {
     		wrap = |
     		XY = [10.w]+20,23
     		backColor = #E9EBEC
     		transparentBackground=1
     		wrap = <li>|</li>
     		10 = TEXT
     		10.text.field = nav_title // title
     		10.offset = 5,20
     		10.fontColor = #646367
     		10.niceText = 1
     		10.fontFile = fileadmin/fonts/ison60.ttf
     		10.fontSize = 18

		}

		RO < .NO
		RO = 1
		RO  {
   			10.fontColor = #000099
		}

		ACT < .NO
		ACT = 1
		ACT  {
   			10.fontColor = #000099
		}
	}


	2 < .1
	2 {
		IProcFunc = user_menu->secondLevel
		wrap =
	}
}


# append Menu JS to page
temp.popupMenu_end = USER
temp.popupMenu_end.userFunc = user_menu->menuEnd

lib.ypmenu = COA
lib.ypmenu{
	10 < temp.popupMenu
	10.wrap = <div style="position:relative; height:150px;">|
	20 < temp.popupMenu_end
	30 = TEXT
	30.value = </div>
} 
/*--------------------------------CSS-------------------------------------*/

ul#menuO {
	list-style-type: none;
	margin:0;
	padding:0;
}
	
ul#menuO li {
	display: block;
	float: left;
	height: 1%;
	position: relative;
} 
	

 
.mmContent {
	font-size: 10px; font-family: Arial, Helvetica, Verdana, Geneva, SunSans-Regular;
	
}

.mmContent ul {
	margin: 0px; 
	padding: 0px;
	list-style: none;
	list-style-image: none;
	z-index:2;
	position:relative; 
	left:0px;
	top:0px;
	background-color: #efefef;
	/*border-right: 1px solid #807F84;
	border-left: 1px solid #807F84;
	border-bottom: 0px solid #807F84;*/
}

.mmContent li {
	padding: 0px; 
	margin: 0px;
	text-align: left;
 }
 
.menuBackground {
	position:absolute;
	left:0px; 
	top:0px;
	z-index:1;
	
}
 
.mmContent li a{
	display: block;
	color: #444444;
	font-weight: normal;
	font-size: 10px;
	padding: 2px;
	text-decoration: none;
	border-bottom: 1px solid #807F84;
	height:13px;
}

.mmContent li a:hover{ 
	color: #fff; 
	background-color: #333399; 
}
/*
.mmContent li a:active { color: #333399; }
*/
.mmContent li a.submenu:hover {
 	color: #fff;
}

/**
 *Menu Styles for our belove IE 5.01
 */

.mmContentb {
	font-size: 9px; font-family: Verdana, Arial, Helvetica, Geneva, SunSans-Regular;
}

.mmContentb ul {
	margin: 0px; padding: 0px 0 10px 0;
	list-style: none;
	z-index:2;
	background-color: #FFFFFF;
	border-right: 1px solid #807F84;
	border-left: 1px solid #807F84;
	border-bottom: 1px solid #807F84;
	position:relative; 
	left:0px; 
	top:0px;
}
.mmContentb li {
	padding: 0px; margin: 0px; }
 
.menuBackground {
	position:absolute;
	left:0px; 
	top:0px;
	z-index:1;
}
 
.mmContentb li a {
	display: block;
	color: #444444;
	/* width: 200px; */
	padding: 2px;
	font-weight: normal;
	text-decoration: none;
	border: none;
}

* html .mmContentb li a {
	width: 160px;
	w\idth: 160px;
}

.mmContentb li a:link { color: #444444; }
.mmContentb li a:visited { color: #444444; }

.mmContentb li a:hover{ color: #333399; background-color: #EEEEEE; cursor: pointer;}
.mmContentb li a:active { color: #333399; }

.mmContentb li a.submenu {
}
.mmContentb li a.submenu:hover {
	color: #333399;
}
/*****************************************************
 * ypSlideOutMenu
 * 3/04/2001
 * 
 * a nice little script to create exclusive, slide-out
 * menus for ns4, ns6, mozilla, opera, ie4, ie5 on 
 * mac and win32. I've got no linux or unix to test on but 
 * it should(?) work... 
 *
 * --youngpup--
 *****************************************************/

ypSlideOutMenu.Registry = []
ypSlideOutMenu.aniLen = 350 // slide out/in time
ypSlideOutMenu.hideDelay = 10
ypSlideOutMenu.minCPUResolution = 10

// constructor
function ypSlideOutMenu(id, dir, left, top, width, height, parentid)
{
	this.ie  = document.all ? 1 : 0
	this.ns4 = document.layers ? 1 : 0
	this.dom = document.getElementById ? 1 : 0

	if (this.ie || this.ns4 || this.dom) {
		this.id			 = id
		this.dir		 = dir
		this.orientation = dir == "left" || dir == "right" ? "h" : "v"
		this.dirType	 = dir == "right" || dir == "down" ? "-" : "+"
		this.dim		 = this.orientation == "h" ? width : height
		this.hideTimer	 = false
		this.aniTimer	 = false
		this.open		 = false
		this.over		 = false
		this.startTime	 = 0

		this.sliding	 = false
		this.parentid	 = parentid
		this.showcount	 = 0

		// global reference to this object
		this.gRef = "ypSlideOutMenu_"+id
		eval(this.gRef+"=this")
		
		this.initleft = left
		this.inittop = top
		this.initwidth = width
		this.initheight = height
		this.showcount = 0;


		// add this menu object to an internal list of all menus
		ypSlideOutMenu.Registry[id] = this

		var d = document

                var strCSS = '<style type="text/css">';
                strCSS += '#' + this.id + 'Container { visibility:hidden; '
		strCSS += 'left:' + left + 'px; '
		strCSS += 'top:' + top + 'px; '
		strCSS += 'overflow:hidden; z-index:10000; }'
		strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
		strCSS += 'width:' + width + 'px; '
		strCSS += 'height:' + height + 'px; '
		strCSS += 'clip:rect(0 ' + width + ' ' + height + ' 0); '
		strCSS += '}'
                strCSS += '</style>';

                d.write(strCSS)

		this.load()
	}
}

ypSlideOutMenu.writeCSS = function() {
	document.writeln('<style type="text/css">');
	for (var id in ypSlideOutMenu.Registry) {
		document.writeln(ypSlideOutMenu.Registry[id].css);
	}
	document.writeln('</style>');
}

ypSlideOutMenu.prototype.load = function() {
	var d = document
	var lyrId1 = this.id + "Container"
	var lyrId2 = this.id + "Content"
	var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1]
	if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
	// var temp

	if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 1000)
	else {
		this.container	= obj1
		this.menu		= obj2
		this.style		= this.ns4 ? this.menu : this.menu.style
		this.homePos	= eval("0" + this.dirType + this.dim)
		this.outPos		= 0
		this.accelConst	= (this.outPos - this.homePos) / ypSlideOutMenu.aniLen / ypSlideOutMenu.aniLen 

		// set event handlers.
		if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
		this.menu.onmouseover = new Function("ypSlideOutMenu.showMenu('" + this.id + "')")
		this.menu.onmouseout = new Function("ypSlideOutMenu.hideMenu('" + this.id + "')")

		//set initial state
		this.endSlide()
	}
}
	
ypSlideOutMenu.showMenu = function(id)
{
	var reg = ypSlideOutMenu.Registry
	var obj = ypSlideOutMenu.Registry[id]
	
	if (obj.container) {
		obj.over = true

		// close other menus.
		// for (menu in reg) if (id != menu) ypSlideOutMenu.hide(menu)

		// if this menu is scheduled to close, cancel it.
		if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer) }

		obj.showcount++;

		// if this menu is closed, open it.
		if (!obj.open && !obj.aniTimer) reg[id].startSlide(true)
	}
}

ypSlideOutMenu.hideMenu = function(id)
{
	// schedules the menu to close after <hideDelay> ms, which
	// gives the user time to cancel the action if they accidentally moused out
	var obj = ypSlideOutMenu.Registry[id]
	if (obj.container) {
		if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
		
		obj.showcount--;
		
		obj.hideTimer = window.setTimeout("ypSlideOutMenu.hide('" + id + "')", ypSlideOutMenu.hideDelay);
	}
}

ypSlideOutMenu.hide = function(id)
{
	var obj = ypSlideOutMenu.Registry[id]
	var reg = ypSlideOutMenu.Registry
	obj.over = false

	if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
	
	// flag that this scheduled event has occured.
	obj.hideTimer = 0
	
	var close = true;
	
	for (menu in reg) {
	// for each child, if either
	// 1. the child is open or
	// 2. the child is closing (but hasn't closed yet)
	// then we don't close this menu.
		var pid = ypSlideOutMenu.Registry[menu].parentid;
		if(pid == id) {
			if (ypSlideOutMenu.Registry[menu].open) close = false;
			if (!ypSlideOutMenu.Registry[menu].open && ypSlideOutMenu.Registry[menu].sliding) close = false;
		}
	}

	// if this menu is open, close it.
	if (obj.open && !obj.aniTimer && close && !obj.showcount) obj.startSlide(false);
}

ypSlideOutMenu.prototype.startSlide = function(open) {
	this[open ? "onactivate" : "ondeactivate"]()
	this.open = open
	if (open) this.setVisibility(true)
	this.startTime = (new Date()).getTime()	
	this.sliding = true;
	this.aniTimer = window.setInterval(this.gRef + ".slide()", ypSlideOutMenu.minCPUResolution)
}

ypSlideOutMenu.prototype.slide = function() {
	var elapsed = (new Date()).getTime() - this.startTime
	if (elapsed > ypSlideOutMenu.aniLen) this.endSlide()
	else {
		var d = Math.round(Math.pow(ypSlideOutMenu.aniLen-elapsed, 2) * this.accelConst)
		if (this.open && this.dirType == "-")		d = -d
		else if (this.open && this.dirType == "+")	d = -d
		else if (!this.open && this.dirType == "-")	d = -this.dim + d
		else										d = this.dim + d

		this.moveTo(d)
	}
}

ypSlideOutMenu.prototype.endSlide = function() {
	this.aniTimer = window.clearTimeout(this.aniTimer)
	this.moveTo(this.open ? this.outPos : this.homePos)
	if (!this.open) this.setVisibility(false)
	this.sliding = false;
	if ((this.open && !this.over) || (!this.open && this.over) && (!this.parent || this.parent.open)) {
		this.startSlide(this.over)
	} else {
		var overchild = false;
		var reg = ypSlideOutMenu.Registry
		for (menu in reg) {
			var pid = ypSlideOutMenu.Registry[menu].parentid
			if (pid == this.id) overchild = ypSlideOutMenu.Registry[menu].over ? true : overchild
		}
		if(!overchild && this.parentid && !ypSlideOutMenu.Registry[this.parentid].over) ypSlideOutMenu.hide(this.parentid);
	}
}

ypSlideOutMenu.prototype.setVisibility = function(bShow) { 
	var s = this.ns4 ? this.container : this.container.style
	s.visibility = bShow ? "visible" : "hidden"
}
ypSlideOutMenu.prototype.moveTo = function(p) { 
	this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px"
}
ypSlideOutMenu.prototype.getPos = function(c) {
	return parseInt(this.style[c])
}

// events
ypSlideOutMenu.prototype.onactivate		= function() { }
ypSlideOutMenu.prototype.ondeactivate	= function() { }
<?php
/***************************************************************
*  Copyright notice
*
*  (c) 2003 Andreas Tschirpke (tschirpke@at-mediendesign.de)
*  All rights reserved
*
*  This script is part of the Typo3 project. The Typo3 project is
*  free software; you can redistribute it and/or modify
*  it under the terms of the GNU General Public License as published by
*  the Free Software Foundation; either version 2 of the License, or
*  (at your option) any later version.
*
*  The GNU General Public License can be found at
*  http://www.gnu.org/copyleft/gpl.html.
*
*  This script is distributed in the hope that it will be useful,
*  but WITHOUT ANY WARRANTY; without even the implied warranty of
*  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
*  GNU General Public License for more details.
*
*  This copyright notice MUST APPEAR in all copies of the script!
***************************************************************/
/**
* User class to build Javascript Menu (www.meade.de)
*
* @author   Andreas Tschirpke <tschirpke@at-mediendesign.de>
*/

class user_menu {
   var $offsetY = 23; // inital offset values for the first level elements
   var $offsetX = 6;
   var $sublevelWidth = 150; // width and height values for sublevel items
   var $sublevelHeight = 18;
   


   var $padding = 5;
   var $fontSize = 11;
   var $breakpoint = 14; // recalculate width of text after x characters
   var $secPadding = 16;

   var $fontFile = 'fileadmin/fonts/ison60.ttf'; // font file needed to calculate linebreaks
   var $transBg = 'fileadmin/images/menu_bg.png'; // transparent PNG file - needed to fix a transparency bug in Mac IE 5

   /**
    *   Dummy function to pass values to buildIndex
    *
    *  @param   array   Menu array including all needed menu items (created by TMENU)
    *   @param   array   Configuration array
    *   @return   array   returns modified $I array
    *   @access   private
    */
    function firstLevel($I,$conf) {
        return $this->buildIndex($I, $conf, 1);
    }
   /**
    *   Dummy function to pass values to buildIndex
    *
    *  @param   array   Menu array including all needed menu items (created by TMENU)
    *   @param   array   Configuration array
    *   @return   array   returns modified $I array
    *   @access   private
    */
   function secondLevel($I,$conf) {
      return $this->buildIndex($I, $conf, 2);
   }
   /**
    *   Dummy function to pass values to buildIndex
    *
    *  @param   array   Menu array including all needed menu items (created by TMENU)
    *   @param   array   Configuration array
    *   @return   array   returns modified $I array
    *   @access   private
    */
   function thirdLevel($I,$conf) {
        return $this->buildIndex($I, $conf, 3);
    }
   /**
    *   Dummy function to pass values to buildIndex
    *
    *  @param   array   Menu array including all needed menu items (created by TMENU)
    *   @param   array   Configuration array
    *   @return   array   returns modified $I array
    *   @access   private
    */
   function fourthLevel($I, $conf) {
           return $this->buildIndex($I, $conf, 4);
    }


   /**
    * Returns true if there is a submenu with items for the page id, $uid
    * Used by the item states "IFSUB" and "ACTIFSUB" to check if there is a submenu
    *
    * @param   integer      Page uid for which to search for a submenu
    * @return   boolean      Returns true if there was a submenu with items found
    * @access private
    */
      // copy from tslib_menu
   function isSubMenu($uid)   {
         // Looking for a mount-pid for this UID since if that exists we should look for a subpages THERE and not in the input $uid;
      $mount_info = $GLOBALS['TSFE']->sys_page->getMountPointInfo($uid);
      if (is_array($mount_info))   {
         $uid = $mount_info['mount_pid'];
      }

      $recs = $GLOBALS['TSFE']->sys_page->getMenu($uid,'uid,pid,doktype,mount_pid,mount_pid_ol');
      foreach($recs as $theRec)   {
         if (!t3lib_div::inList('5,6',$theRec['doktype']) && !$theRec['nav_hide'])   {   // If a menu item seems to be another type than 'Not in menu', then return true (there were items!)
            return TRUE;
         }
      }
   }

   /**
    * Breaks textarea text into lines of specified width in order to feed Gifbuilder (see function makeTextImage)
    *
    * @param    string        $text: input text
    * @param    integer        $size: specified font size
    * @param    string        $font: absolute path to specified font file
    * @param    integer        $width: specified width of the image box
    * @return    array        array of lines of text
    */
       // copy from sr_sendcard
      // thanks and credits go to Peter Bowyer <peter@sendcard.org>
   function text_to_lines($text, $size, $font, $width) {
      $words = t3lib_div::trimExplode(' ', str_replace("\r", ' <br> ', str_replace("\n\r", ' <br> ', str_replace("|", ' <br> ', $text))), 0);

      $p = 0;
      $lines = array();
      $lines[0] = '';

      for($i = 0; $i < count($words); $i++) {
         ($lines[$p] ) ? $test = $lines[$p].' '.$words[$i] : $test = $words[$i];
		 //echo($font);
         $bbox = imagettfbbox($size, 0, $font, $test);

         if ($words[$i] == '<br>') {
            $p++;
            $lines[$p] = '';
         } elseif (($bbox[4] - $bbox[6]) > $width ) {
            $p++;
            $lines[$p] = $words[$i];
         } else {
            $lines[$p] = $test;
         }
      }
      return count($lines);
   }

   /**
    * Collects all needed information (width, height, x, y, level etc.) and structural information for the ypMenu.
    * Information are stored in $GLOBALS['TSFE']->applicationData['ypMenus']
    *
    * @param    array        $I: Array created by TMENU including all menu elements for the current level
    * @param    integer      $conf: Configuration array
    * @param    integer      $level: hierarchical depth
    * @return   array        $I: modified $I array
    */
   function buildIndex($I, $conf, $level) {
         // fix IE 5.0 on windows
      $clientAdjust = 0;
      $clientinfo = t3lib_div::clientInfo();
//t3lib_div::debug($clientinfo);
      if($clientinfo['SYSTEM'] == 'win' AND $clientinfo['BROWSER'] == 'msie' AND $clientinfo['VERSION'] < 5.5) {
         $clientAdjust = 2;
      }
	  if($clientinfo['SYSTEM'] == 'win' AND $clientinfo['BROWSER'] == 'msie'){
	  	$this->sublevelHeight = 19;
	  }
//var_dump($I);


      switch($level) {
      case "1":
            // only wrap in ypSlide Action if submenu is present
         if($this->isSubMenu($I['uid'])) {
               // JS actions
            $onmouseover = "ypSlideOutMenu.showMenu('menu" .$I['uid']. "'); over('" .$I['theName']. "');";
            $onmouseout = "ypSlideOutMenu.hideMenu('menu" .$I['uid']. "');";// out('" .$I['theName']. "');";

               // collect data for correct positions
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['level'] = $level;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['uid'] = $I['uid'];
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['imgwidth'] = $I['val']['output_w'];
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['imgheight'] = $I['val']['output_h'];
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['width'] = $this->sublevelWidth;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['height'] = $this->sublevelHeight;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['dir'] = 'down';
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['top'] = $this->offsetY;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['left'] = $GLOBALS['TSFE']->applicationData['ypTemp']['x'] + $this->offsetX;

               // build ypMenu JS
            $GLOBALS['TSFE']->applicationData['ypTemp']['js'] .= "
menu". $I['uid'] .".onactivate = new Function(\"document.images['" .$I['theName']. "'].src = " .$I['theName']. "_h.src\");
menu". $I['uid'] .".ondeactivate = new Function(\"document.images['" .$I['theName']. "'].src = " .$I['theName']. "_n.src\");

";
         } else { // no ypMenu needed
            $onmouseover = "over('" .$I['theName']. "');";
            $onmouseout = "out('" .$I['theName']. "'); ";
         }
            // move right
         $GLOBALS['TSFE']->applicationData['ypTemp']['x'] += $I['val']['output_w'];

         $I['parts']['ATag_begin'] = '<a href="' .$I['linkHREF']['HREF']. '" onfocus="' . $I['linkHREF']['onFocus']. '" onmouseover="'. $onmouseover .'" onmouseout="'. $onmouseout .'" id="act'. $I['uid'] .'">';
         $I['parts']['ATag_end'] = '</a>';
      break;
      default: // every other level (TMENU)
         $title = $I['title'];

            // count lines if more than $this->breakpoint chars
         if(strlen($title) > $this->breakpoint) {
            $lines = $this->text_to_lines($I['title'], t3lib_div::freetypeDpiComp($this->fontSize), $this->fontFile, ($this->sublevelWidth - 2*$this->padding));
         } else {
            $lines = 1;
         }

            // if another submenu is present wrap link with JS actions an collect data
         if($this->isSubMenu($I['uid'])) {
            $href = $I['linkHREF']['HREF'];
            $onmouseover = "ypSlideOutMenu.showMenu('menu" .$I['uid']. "');";
            $onmouseout = "ypSlideOutMenu.hideMenu('menu" .$I['uid']. "');";
            $link = sprintf('<a href="%s" onmouseover="%s" onmouseout="%s" class="submenu">%s</a>',$href, $onmouseover, $onmouseout, $title);

            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['level'] = $level;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['uid'] = $I['uid'];
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['width'] = $this->sublevelWidth;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['height'] = $this->sublevelHeight;
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['dir'] = 'right';
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['top'] = intval($GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['top']) + (($I['key']) * $this->sublevelHeight);
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['left'] = intval($GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['left']) + intval($GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['width']);
            $GLOBALS['TSFE']->applicationData['ypMenus'][$I['uid']]['parentId'] = $I['pid'];

         } else { // nothing to be done here :)
            $link = $I['parts']['ATag_begin']. $title .$I['parts']['ATag_end'];
         }

            // move down
         if($I['key'] == 0) {
            $GLOBALS['TSFE']->applicationData['ypTemp'][$I['pid']]['y'] = intval($GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['top']);
         } else {
            $GLOBALS['TSFE']->applicationData['ypTemp'][$I['pid']]['y'] += $this->sublevelHeight + ($this->secPadding * ($lines-1)) + $clientAdjust;
         }


         $GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['items'][$I['uid']]['link'] = $link;
         $GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['items'][$I['uid']]['height'] = $this->sublevelHeight + ($this->secPadding * ($lines-1));
         $GLOBALS['TSFE']->applicationData['ypMenus'][$I['pid']]['items'][$I['uid']]['top'] = $GLOBALS['TSFE']->applicationData['ypTemp'][$I['pid']]['y'] - ($this->secPadding * ($lines-1));

         // save link in output array
      $I['parts']['ATag_begin'] = '
<a href="' .$I['linkHREF']['HREF']. '"
   onfocus="' . $I['linkHREF']['onFocus']. '"
   onMouseOver="ypSlideOutMenu.showMenu(\'menu'.$I['uid'].'\');"
   onMouseOut="ypSlideOutMenu.hideMenu(\'menu'.$I['uid'].'\');"
id="level1id'.$I['uid'].'">';
      //$GLOBALS['TSFE']->applicationData['ypMenu'][$level][$I['pid']]['parts']['items'][] = implode('', $I['parts']);
      $I['parts'] = array();
      break;
      }

      return $I;
   }

   /**
    * Builds all HTML/JS Code to initialize all ypMenu layers. Must be writen at the end of the document
    *
    * @return   string        html/js code
    */
   function menuEnd() {
         // all relevant data stored in applicationData['ypMenus'];
      if(is_array($GLOBALS["TSFE"]->applicationData['ypMenus'])) {
            // fix differnet browser bugs to get a transparency effect
         $clientinfo = t3lib_div::clientInfo();
         $pngimg = false;
         $pngbg = false;
         $filter = false;
         $appendix = '';
         $bg = false;
            // ie >= 5.5 on win and mozilla can render transparency by css
         if(($clientinfo['SYSTEM'] == 'win' AND $clientinfo['BROWSER'] == 'msie' AND $clientinfo['VERSION'] >= 5.5) OR ($clientinfo['SYSTEM'] == 'win' AND $clientinfo['BROWSER'] == 'net')) {
            $filter = true;
            $style = 'style="-moz-opacity:.8; filter:alpha(opacity=80); background-color: #CFCED0"';
            // Mr. IE on Mac needs a special treatment - a transparent png in a img tag in the background
         } elseif($clientinfo['SYSTEM'] == 'mac' AND ($clientinfo['BROWSER'] == 'msie')) {
            $pngimg = true;
            $style = 'style="background-color: transparent"';
            // Opera and Mozilla on Mac can handle transparent pngs
         } elseif(($clientinfo['SYSTEM'] == 'mac' AND $clientinfo['BROWSER'] == 'net') OR ($clientinfo['BROWSER'] == 'opera')){
            $pngbg = true;
            $style = 'style="background-image: url(\''. $this->transBg .'\');"';
            // no transparency for the rest - go get firefox!
         } else {
            $bg = true;
            $style = 'style="background-color: transparent"';
            $appendix = 'b';
         }

		$counter = 0;
            // loop through all collected data (buildIndex) and render js
         foreach($GLOBALS["TSFE"]->applicationData['ypMenus'] as $menu) {
			
			$counter++;
			
            $uid = $menu['uid'];
            $level = $menu['level'];
            $dir = $menu['dir'];
            $parentId = ($menu['parentId']) ? '"menu'.$menu['parentId'].'"' : 'null';
            $x = $menu['left'];
            $y = ($menu['parentId']) ? $GLOBALS['TSFE']->applicationData['ypMenus'][$menu['parentId']]['items'][$uid]['top'] : $this->offsetY;
            $width = $menu['width'];

            $items = '';
            $wholeHeight = 0;
            if(is_array($menu['items'])) {
               $itemcount = count($menu['items']);
               foreach($menu['items'] as $item) {
                  $items .= '<li>'. $item['link'] ."</li>\n";
                  $wholeHeight = $wholeHeight + $item['height'];
               }
            }

            if($clientinfo['SYSTEM'] == 'win' AND $clientinfo['BROWSER'] == 'msie' AND $clientinfo['VERSION'] < 5.5) {
               $wholeHeight = $wholeHeight + 2 * $itemcount;
            }

            $height = ($menu['height']) * count($menu['items']);
            $output[] = sprintf('<div id="menu%dContainer" class="mmContainer"><div id="menu%dContent" class="mmContent%s" %s>', $uid, $uid, $appendix, $style); // L%d / $level
            $output[] = sprintf('<ul class="mmLevel%d">%s</ul>', $level, $items);

               // trick Mac IE to display our transparent PNG
            if($pngimg) {
               $output[] = '<img src="' . $this->transBg .'" width="'. $width .'" height="'. $wholeHeight .'" class="menuBackground">';
            }

            $output[] = '</div></div>';

            $menus[] = sprintf('menu%d = new ypSlideOutMenu("menu%d", "%s", %d, %d, %d, %d, %s)', $uid, $uid, $dir, $x, $y, $width, $wholeHeight, $parentId);
         }
      }

      if(is_array($output) && is_array($menus)) {
         $output = implode("\n", $output);
         $output .= "
<script type=\"text/javascript\">\n"
. implode("\n", $menus) ."

ypSlideOutMenu.writeCSS();

". $GLOBALS['TSFE']->applicationData['ypTemp']['js'] ."
</script>
";
         return $output;
      }
    }
}
?>
Zu den Code Snippets