---
title: "DropDown Menü - Probleme"
url: "https://www.typo3.net/d/83738-dropdown-menue-probleme"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage","HTML & CSS","JavaScript & AJAX"]
created: "2008-11-07"
last_reply: "2008-11-07"
replies: 0
solved: false
page: 1
pages: 1
lang: "de"
---

# DropDown Menü - Probleme

TYPO3 › Menüs · 0 Antworten · gestartet 2008-11-07

## Eröffnungsbeitrag

**Sebastian Schmal** · 2008-11-07 · [Beitrag #1](https://www.typo3.net/d/83738-dropdown-menue-probleme/1)

Hallo,

leider komm ich mit meinen DropDown-Menü nicht klar...

habe eine HTML Templatedatei erstellt:

im head:

```php
<script type="text/javascript">
    //<![CDATA[
        function show(element){
            element.className += "hover";
        }
        function hide(element){
            element.className = element.className = "";
        }
    //]]>
    </script>
```

im template:

```html
<!-- ANFANG NAVI -->
            <div id="navi">
                <ul class="navigation">
                    <li><a href="#">Startseite</a></li>
                    <li onmouseover="show(this)" onmouseout="hide(this)">
                        <a href="#" class="active">tester</a>
                        <ul onmouseover="show(this)" onmouseout="hide(this)">
                          <li><a href="#">Ebene2 Punkt1</a></li>
                          <li><a href="#">Ebene2 Punkt2</a></li>
                          <li><a href="#">Ebene2 Punkt3</a></li>
                        </ul>
                    </li>
                    <li><a href="#">Forum</a></li>
                    <li><a href="#">Team</a></li>
                    <li><a href="#">Partner</a></li>
                    <li><a href="#">Impressum</a></li>
                </ul>
            </div>
```

navi css:

```html
#navi {
    position:absolute;
    margin: 0px;
    margin-top: 94px;
    margin-left: 100px;
    padding: 0px;
    height: 21px;
    }

ul.navigation, ul.navigation ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

ul.navigation a {
    display: block;
    margin: 0px 0px 0px 0px;
    padding: 5px 12px 4px 12px;
    font-family: Verdana;
    font-size: 11px;
    font-weight: bold;
    color: #f0f0f0;
    text-decoration: none;
    border-left: 5px #3a3a45 solid;
}

ul.navigation a:hover {
    margin: 0px 0px 0px 0px;
    padding: 5px 12px 4px 12px;
    font-family: Verdana;
    font-size: 11px;
    font-weight: bold;
    color: #6b6b74;
    text-decoration: none;
    }

ul.navigation a.active {
    color: #6b6b74;
}

ul.navigation ul a {
    margin: 0px;
    padding: 0px;
}

ul.navigation li {
    margin: 0px;
    padding: 0px;
    background-image: none;
    float:left;
    border: 0px;
}
    ul.navigation ul {
    margin-left:0;
    padding: 0 0 5px 0;
    position: absolute;
    background-color: #3a3a45;
    border-left:1px solid #6b6b73;
    border-right:1px solid #6b6b73;
    border-bottom:1px solid #6b6b73;
    display:none;
    min-width: 150px;
}

/* IE-Hack für die Breite */
*html ul.navigation ul {
    width: 150px;
}

/* Dies sind die Klassenstile für das Untermenü wenn sich die Maus */
/* über der Liste  befindet (.hover siehe JavaScript oben) */
ul.navigation ul.hover, ul.navigation li.hover ul, ul.navigation li:hover ul  {
    display:block;
}

ul.navigation ul li {
    float:none;
    background-color: transparent;
}

ul.navigation ul li a {
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 4px 3px;
    font-family: Verdana;
    font-size: 10px;
    font-weight: normal;
    color: #f0f0f0;
    text-decoration: none;
}

ul.navigation ul li a:hover {
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 4px 3px;
    font-family: Verdana;
    font-size: 10px;
    font-weight: normal;
    color: #6b6b74;
    text-decoration: none;
}
```

in meinen xhtml-Template funktioniert alles super!

doch bau ich das navi in mein typo3 ein, funktioniert es nicht...

navi typo3:

```typoscript
# ---------------------
# MainNavi
# ---------------------

temp.menu = HMENU
temp.menu {
  ### Erste Ebene ###
    1 = TMENU
    1 {
      wrap = <ul class="navigation">|</ul>
      noBlur = 1
      expAll = 1
      #NO.wrapItemAndSub = <li onmouseover="show(this)" onmouseout="hide(this)">|</li>
      NO.wrapItemAndSub = <li>|</li> || <li onmouseover="show(this)" onmouseout="hide(this)">|</li> |*| <li>|</li>

      ACT < .NO
      ACT = 1
      ACT.ATagParams = class="active"
    }

    ### Zweite Ebene ###
    2 = TMENU
    2 {
      noBlur = 1
      wrap = <ul onmouseover="show(this)" onmouseout="hide(this)">|</ul>
      NO.allWrap = <li>|</li>
    }
}
```

sobald ich über "tester" hover, und dann von dem hover runter gehe, verschwindet der navibutton einfach aus dem navi!

Würde mich über Hilfe sehr freuen!

grüße, Basti

---

Quelle: „DropDown Menü - Probleme“, typo3.net, https://www.typo3.net/d/83738-dropdown-menue-probleme
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.