Dropdown Menü

**mrmonitor** · 13.11.2011, 13:24

Hallo ich habe folgende Codes und ein horizontales Menü, wie kann ich daraus ein DropDown Menü machen

TS Code: (temp.nav)

HTML-Code:

################
#Hauptnavigation
################
temp.main_nav = HMENU
temp.main_nav {
    special = directory
    special.value = 1
    
    1 = TMENU
    1 {
wrap = <ul>|</ul>
 expAll = 1
 NO.wrapItemAndSub = <li>|</li>
  
wrap = <div id="mainNav"><ul>|</ul></div>
        
        NO.wrapItemAndSub = <li>|</li>
        NO.stdWrap.field = title
        
        ACT < .NO
        ACT.ATagParams =class="active"
        ACT = 1
        
        CUR < .ACT
        CUR = 1      
               
}

CSS Code: (fileadmin/: templates/css/navigation.css)

HTML-Code:

@charset "utf-8";
/* navigation */
#mainNav {
margin: 20px 0 5px 0px;
text-align: left;
}
#mainNav ul {
list-style: none;
padding: 0;
margin: 0;
}
#mainNav li {
float: left;
padding-right: 10px;
margin: 35px 0 5px 0px;
color:#FFFFFF;
}
#mainNav li a {
 font-size: 1.3em;
 color: #FFFFFF;
 text-decoration:none;
}
#mainNav li a:hover {
 text-decoration:underline;
}
#mainNav .active {
 text-decoration:underline;
}

**_Tobi** · 13.11.2011, 17:24

Dir fehlt ne zweite Menüebene.

Kleiner Tipp am Rande: Gerade bei solchen Grundsatzproblemen hilft die Doku von TYPO3 ungemein weiter.

Gruß Tobi

**mrmonitor** · 13.11.2011, 19:38

Zitat von _Tobi

Dir fehlt ne zweite Menüebene.

Kleiner Tipp am Rande: Gerade bei solchen Grundsatzproblemen hilft die Doku von TYPO3 ungemein weiter.

Gruß Tobi

Zitat von _Tobi

Hallo,

da hilft ein Blick in die TYPO3-Doku
Ein Menü bauen

Gruß Tobi

ok das hat geholfen

nachdem ich aber einen Code einbaue klappt das Menü nicht auf, sondern erscheint direkt darunter

Ich zeige mal den Code (der neu hinzugefügte Code ist auskommentiert #)

Code:

################
#Hauptnavigation
################
temp.main_nav = HMENU
temp.main_nav {
special = directory
special.value = 1

1 = TMENU
1 {
wrap = <ul>|</ul>
expAll = 1
NO.wrapItemAndSub = <li>|</li>
wrap = <div id="mainNav"><ul>|</ul></div>
NO.wrapItemAndSub = <li>|</li>
NO.stdWrap.field = title

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

CUR < .ACT
CUR = 1

}

# 2 = TMENU
# 2 {

#wrap = <ul>|</ul>
#NO.wrapItemAndSub = <li>|</li>
#wrap = <div id="mainNav"><ul>|</ul></div>
# NO.wrapItemAndSub = <li>|</li>
# NO.stdWrap.field = title

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

# CUR < .ACT
#CUR = 1
}

}

Dazu stehen hier noch eine Skizze vom Menü:

Und ich habe drei HTML Seiten: (Start.html, einreiher.html und main.html) mit jeweils folgendem Code

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<link href="/fileadmin/templates/css/layout.css" rel="stylesheet" type="text/css" />
<link href="/fileadmin/templates/css/fonts.css" rel="stylesheet" type="text/css" />
<link href="/fileadmin/templates/css/navigation.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!-- ###DOKUMENT### begin -->
<div id="mainWrap">
<div id="header">
<!--###MAINNAV### begin -->
<div id="mainNav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Ich</a></li>
<li><a href="#">Hilfe</a></li>
<li><a href="#">Kontakt</a></li>
</ul>
</div>
<!--###MAINNAV### end --> 

</div><!--Ende header -->



</div><!--Ende contentWrap -->

</div><!--Ende mainWrap -->
<!-- ###DOKUMENT### end -->
</body>
</html>