---
title: "ypMenu Anleitung !?"
url: "https://www.typo3.net/d/37503-ypmenu-anleitung"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage"]
created: "2006-02-08"
last_reply: "2006-02-13"
replies: 22
solved: false
page: 1
pages: 1
lang: "de"
---

# ypMenu Anleitung !?

TYPO3 › Menüs · 22 Antworten · gestartet 2006-02-08

## Eröffnungsbeitrag

**Kev** · 2006-02-08 · [Beitrag #1](https://www.typo3.net/d/37503-ypmenu-anleitung/1)

Hallo Typo3 Community

Ich möchte gerne wissen ob es eine etwas genauer beschriebene Anleitung für einen "Anfänger" in sachen Typo3 gibt.

[/d/20440-beispiel-ypmenu-gmenu-horizontal-ypslideoutmenus](https://www.typo3.net/d/20440-beispiel-ypmenu-gmenu-horizontal-ypslideoutmenus)

Sieht sehr gut aus, und ich finde auch schön das es vielen hilfen mag, jedoch hat es mich nur noch mehr verwirrt :o

Das ganze möchte ich nur lokal auf meinem Rechner zum testen brauchen. Ich habe auch schon selber Menus gemacht jedoch hab ich keine Ahnung wie ich das yp überhaupt angehen soll... daher ist auch noch nix an ts zusammen,..

Es wäre nett wenn jemand eine detaillierte Anleitung geben könnte, damit ich wenigstens weiss wo ich anfangen und aufbauen kann.

Gruss

## Antworten

### [#2](https://www.typo3.net/d/37503-ypmenu-anleitung/2) · woida · 2006-02-08

Du brauchst doch nur die Datein runerladen und die Codeschnipsel in dein Setup einfügen. Was soll man dazu groß schreiben?

### [#3](https://www.typo3.net/d/37503-ypmenu-anleitung/3) · Kev · 2006-02-08

> **woida schrieb:**
>
> Du brauchst doch nur die Datein runerladen und die Codeschnipsel in dein Setup einfügen. Was soll man dazu groß schreiben?

Ich kann die Dateien nich runterladen weil sie nich gefunden werden?

### [#4](https://www.typo3.net/d/37503-ypmenu-anleitung/4) · woida · 2006-02-08

Ahhhh. Kannst ja auch gleich sagen:
<http://www.sci-worx.com/slideoutmenu.zip> (nicht meine Seite)
Das müßte das Paket aus dem obigen Thread sein.

### [#5](https://www.typo3.net/d/37503-ypmenu-anleitung/5) · Kev · 2006-02-08

> **woida schrieb:**
>
> Ahhhh. Kannst ja auch gleich sagen:
> <http://www.sci-worx.com/slideoutmenu.zip> (nicht meine Seite)
> Das müßte das Paket aus dem obigen Thread sein.

Danke <3 8-)

Ich werd mich ma damit versuchen

### [#6](https://www.typo3.net/d/37503-ypmenu-anleitung/6) · Kev · 2006-02-09

schon ok ich bin zu dumm, aber habs jetzt geschafft #paralyzed#

### [#7](https://www.typo3.net/d/37503-ypmenu-anleitung/7) · terranet · 2006-02-11

Hallo,

also würde mir auch eine Anleitung wünschen  :o
Habe mir alle Threads zum Menü durchgelesen - teilweise
kenne ich mich vor lauter verschiedener Code-Stücke überhaupt nicht mehr aus ...
dann auch der Unterschied horizontal und vertikal ! #angry#

Vielleicht wäre ja wer so nett und würde nur kurz die paar Schritte hereinschreiben ?

DANKE Harry

### [#8](https://www.typo3.net/d/37503-ypmenu-anleitung/8) · michlbeck · 2006-02-12

ich hab folgendes Problem. Mein Menü zeigt die erste Ebene richtig als GMENU an. Die tieferen Ebenen werden zwar ausgefahren, aber nur als Text, ohne den Kasten dahinter.
Mein Setup fürs Menü ist:

```typoscript
page.includeLibs.ypMenu = fileadmin/templates/ypMenu/ypMenu.php
page.headerData.11 = TEXT
page.headerData.11.value = <script type="text/javascript" src="fileadmin/templates/ypMenu/ypSlideOutMenus.js" language="JavaScript"></script>

page.headerData.12 = TEXT
page.headerData.12.value =  <link rel="stylesheet" type="text/css" href="fileadmin/templates/ypMenu/ypMenu.css" /> 

temp.ypMenu.special = directory
temp.ypMenu.special.value = 1

temp.ypMenu = HMENU
temp.ypMenu{
  special = directory
  special.value=1
    1 = GMENU
     1 {
          IProcFunc = user_menu->firstLevel
          expAll = 1
          wrap = |
          NO = 1
          NO {
               wrap = |
               XY = [50.w]+10, 22
         #      30 = IMAGE
         #      30.file = fileadmin/templates/ypMenu/menu.gif
               50 = TEXT
               50 {
                    text.field = title
                    fontSize = 12
                    fontFile = fileadmin/templates/fonts/verdana.ttf
                    fontColor = #000000
                    offset = 5,18
                    niceText = 0
                    transparentBackground = 1
               }
              # 100 = || IMAGE
             #  100.file = fileadmin/scripts/ypMenu/menu_space.gif
          }
 
          IFSUB < temp.ypMenu.1.NO
          IFSUB = 1
 
          RO < temp.ypMenu.1.NO
          RO = 1
          RO {
               backColor = #bcdeec
               30 >
          }
 
          IFSUBRO < temp.ypMenu.1.NO
          IFSUBRO = 1
          IFSUBRO {
               backColor = #bcdeec
               30 >
          }
     }    
 
     2 = TMENU
     2 {
         IProcFunc = user_menu->secondLevel
         expAll = 1
             NO.linkWrap = <li>|</li>
     }
 
     3 = TMENU
     3 {
          IProcFunc = user_menu->thirdLevel
          expAll = 1
   

     }
 
     4 = TMENU
     4 {
          IProcFunc = user_menu->fourthLevel
          expAll = 1
          NO.linkWrap = <li>|</li>
     }
}

temp.user_menu = USER
temp.user_menu.userFunc = user_menu->menuEnd 

#temp.ypMenu.3 >
#temp.ypMenu.4 >

page.10.subparts.ypmenu = COA
page.10.subparts.ypmenu{
  10 < temp.ypMenu
  20 < temp.user_menu
}
```

### [#9](https://www.typo3.net/d/37503-ypmenu-anleitung/9) · michlbeck · 2006-02-12

hat niemand ein solches problem? siehe: www.papillo.de

### [#10](https://www.typo3.net/d/37503-ypmenu-anleitung/10) · woida · 2006-02-12

> **michlbeck schrieb:**
>
> ich hab folgendes Problem. Mein Menü zeigt die erste Ebene richtig als GMENU an. Die tieferen Ebenen werden zwar ausgefahren, aber nur als Text, ohne den Kasten dahinter.

Ja, weils die Datei <http://www.papillo.de/fileadmin/templates/img/nav_arrow.gif> nicht gibt.

### [#11](https://www.typo3.net/d/37503-ypmenu-anleitung/11) · michlbeck · 2006-02-12

nun gibts die datei und es funktioniert immer noch nicht.

### [#12](https://www.typo3.net/d/37503-ypmenu-anleitung/12) · woida · 2006-02-12

Dann wirf doch mal einen kritischen Blick in deinen Quellcode: Du weißt deinen Links die Klasse "mmlink" zu. Die ist aber nirgends definiert.
Dafür gibts aber mmContentb über das du verschiedene Listen formatierst. Nur gibt es in deinem Quellcode keine einzige Liste...

So wies aussieht, hast du da einfach was aus meheren Threads zusammengewürfelt.

### [#13](https://www.typo3.net/d/37503-ypmenu-anleitung/13) · michlbeck · 2006-02-13

super, DANKE!!! darauf muss man erstmal kommen, dass verschiedene php-scripts im umlauf sind!

### [#14](https://www.typo3.net/d/37503-ypmenu-anleitung/14) · michlbeck · 2006-02-13

noch ne frage...

hab die dateien von www.sci-worx.com genommen. alles wird super angezeigt, nur wenn das menü auf ebene 2 rechts ausfahren soll, soll doch die menu_sub mit den ">>" angezeigt werden. das tuts aber bei mir nicht.

### [#15](https://www.typo3.net/d/37503-ypmenu-anleitung/15) · terranet · 2006-02-13

Könnte mir jemand nochmals eine Sammlung der funktionierenden Dateien + dazugehörige Templates,Vorlage,CSS schicken, oder hier posten ? Danke Harry

### [#16](https://www.typo3.net/d/37503-ypmenu-anleitung/16) · woida · 2006-02-13

Wenns das nächte mal nicht geht, könntest du zuerst mal deine Pfade überprüfen:
<http://www.papillo.de/fileadmin/template/ypMenu/menu_sub.gif>
<http://www.papillo.de/fileadmin/template/ypMenu/menu_sub.png>
gibts nämlich nicht.

@terranet
Das verikale Menü gibts unter [/d/31085-ypmenu-vertikal](https://www.typo3.net/d/31085-ypmenu-vertikal). Wo eine vollständige horizontale Version ist, weiß ich nicht. Da mußt du selber suchen.

### [#17](https://www.typo3.net/d/37503-ypmenu-anleitung/17) · michlbeck · 2006-02-13

lol, ich hab das "s" vergessen. war doch schon zu spät um noch klar denken zu können. super danke woida!!

### [#18](https://www.typo3.net/d/37503-ypmenu-anleitung/18) · terranet · 2006-02-13

@woida:

Vertikales-Menü:
Kopiert-geändert-gestartet-funktioniert

Horizontales-Menü:
Vielleicht kann wer wie woida kurz soetwas posten ???? Dann verstehen es auch wir Dummen  #angry#

### [#19](https://www.typo3.net/d/37503-ypmenu-anleitung/19) · woida · 2006-02-13

Im Prinzip mußt du nur die php-Datei austauschen.

### [#20](https://www.typo3.net/d/37503-ypmenu-anleitung/20) · terranet · 2006-02-13

Hm,

1) Datei ausgetauscht ...
2) <br/> im Template weggelassen
3) Positionen für das Menü stimmen noch nicht - welche gehören da geändert ??

### [#21](https://www.typo3.net/d/37503-ypmenu-anleitung/21) · woida · 2006-02-13

Steht in [/d/31085-ypmenu-vertikal](https://www.typo3.net/d/31085-ypmenu-vertikal)!

### [#22](https://www.typo3.net/d/37503-ypmenu-anleitung/22) · terranet · 2006-02-13

@Punkt3)

var $offsetY = 24; // inital offset values for the first level elements

var $offsetX = 0;

damit ist es fertig !

ypmenu.php für Horizontal lautet :

```php
<?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.sci-worx.com)
*
* @author Andreas Tschirpke <tschirpke@at-mediendesign.de>
*
* Modified by Alex.Elsner <alex.elsner@cms-medien-design.de>
*/

#$GLOBALS['TSFE']->set_no_cache();  // wird nicht mehr gebraucht :)

class user_menu {
   var $offsetY = 24; // inital offset values for the first level elements
   var $offsetX = 0;
   var $sublevelWidth = 177; // width and height values for sublevel items
   var $sublevelHeight = 22;
   
   var $padding = 5;
   var $fontSize = 10;
   var $breakpoint = 28; // recalculate width of text after x characters
   var $secPadding = 12; // 16 padding inc. border
   
   var $fontFile = 'fileadmin/template2/verdana.ttf'; // font file needed to calculate linebreaks
   var $transBg = 'fileadmin/menu_bg.png'; // transparent PNG file - needed to fix a transparency bug in Mac IE 5  //braucht man nicht mehr
   
   /**
    *   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];

         $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
		 // no longer necessarily
      $clientAdjust = 0;
#      $clientinfo = t3lib_div::clientInfo();
#      if($clientinfo['SYSTEM'] == 'win' AND $clientinfo['BROWSER'] == 'msie' AND $clientinfo['VERSION'] < 5.5) {
#         $clientAdjust = 2;
#      }
      
         
      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>';
		 // Mod for XHTML strict
#		 $I['parts']['image'] = str_replace("name", "id", $I['parts']['image']);
#		 $I['parts']['image'] = str_replace("border=\"0\"", "", $I['parts']['image']); 
      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;
		 	// no longer necessarily, all browser get same code
            // 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:.9; filter:alpha(opacity=90); background-color: #E1EDFD"';
            // 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';
         }
            
            // loop through all collected data (buildIndex) and render js
         foreach($GLOBALS["TSFE"]->applicationData['ypMenus'] as $menu) {
            $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) {
			   	// modifited
#                 $items .= '<li>'. $item['link'] ."</li>\n";
                 $items .= '<div class="mmlink">'. $item['link'] ."</div>\n";
                  $wholeHeight = $wholeHeight + $item['height'];
               }
            }
			// no longer necessarily
#            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
			// ul to div!!!
#            $output[] = sprintf('<ul class="mmLevel%d">%s</ul>', $level, $items);
			$output[] = sprintf('<div class="mmLevel%d">%s</div>', $level, $items);
				// no longer necessarily
				// trick Mac IE to display our transparent PNG
#            if($pngimg) {
#               $output[] = '<img src="' . $this-" alt="" />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;
      }
    }
}
?>
```

### [#23](https://www.typo3.net/d/37503-ypmenu-anleitung/23) · terranet · 2006-02-13

Hm,

hab das Menü jetzt angepaßt - nur, wenn man
die Auflösung des Computers verändert, stimmen die Positionen der Submenüs nicht mehr  :'( ...
Welche Lösung gibt es da ?

---

Quelle: „ypMenu Anleitung !?“, typo3.net, https://www.typo3.net/d/37503-ypmenu-anleitung
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.