German  |  English
Search:
Sie sind hier: Tutorial Typo3 » Menü TMENU

Menü TMENU vertikal

Code TypoScript Template
  # menu_1 vertikal (Xo-data)
  temp.menu_1 = HMENU
  temp.menu_1 {
    special = directory
    special.value = 2     
    entryLevel = 1          
    wrap = <div id="menu_1">|</div>
    1 = TMENU
    1 {
      expAll= 1
      noBlur = 1
      wrap = <ul>|</ul>
      NO = 1
      NO {              
          stdWrap.crop = 19 | ...
          linkWrap = |
          wrapItemAndSub = <li>|</li>
          ATagTitle.field = abstract // description // title
      }   
      ACT < .NO
      ACT.ATagParams = class="act"
    }
    2 < .1
    2.expAll = 0
    3 < .1
    4 < .1
  }  

  # Main TEMPLATE cObject for the BODY ###
  temp.mainTemplate = TEMPLATE       
  temp.mainTemplate {               
 
  # Feeding the content from the Auto-parser to the TEMPLATE cObject:
  template =< plugin.tx_automaketemplate_pi1

  # Substitute menu_1
  subparts.menu_1 < temp.menu_1

  }
Code HTML-Template
// subpart
<div id="menu_1">
</div>
Code CSS
/* temp.menu_1 */
div#menu_1
{
   background-color: transparent;
   width: auto;
   border: 0px solid black;
   border-bottom: 0px;
}
div#menu_1 * 
{
   margin: 0px;
   padding: 0px;
   color: #3F4142;
}
 
div#menu_1 .act
{
   color: #3F4142;
}
 
/* 1. Ebene */
div#menu_1 ul
{
   list-style-type: none;
}
div#menu_1 ul li
{   
   padding-bottom: 10px;
   border-bottom: 0px solid;
   border-bottom-color: #959595;
   list-style-type: none;
}
div#menu_1 ul li a,
div#menu_1 ul li div
{    
   padding-bottom: 2px;
   padding-top: 1px;
   text-decoration: none;
   font-family: verdana,arial,helvetica, sans-serif;
   font-size: 11px;
   font-weight: normal;
   display: block;
   padding-left: 5px;
   background-color: #E1E1E1;
}
div#menu_1 ul li a:hover
{
   background-color: #E1E1E1;
}
div#menu_1 ul li .act
{
   color: #3F4142;
   padding-left: 5px;
}
 
/* 2. Ebene */
div#menu_1 ul ul
{
   background-color: transparent;
}
div#menu_1 ul ul li
{
   padding-top: 2px;
   border-bottom: none;
   padding-bottom: 0px;
}
div#menu_1 ul ul li a,
div#menu_1 ul ul li div
{
   font-size: 11px;
   background-image: url(../images/p1.gif);
   background-repeat: no-repeat;
   padding-left: 14px;
   background-position: 5px;
   background-color: transparent;
}
div#menu_1 ul ul li a:hover
{
   background-color: #E1E1E1;
}
div#menu_1 ul ul li .act
{
   color: #3F4142;
   background-image: url(../images/p2.gif);
   background-repeat: no-repeat;
   font-weight: normal;
   padding-left: 14px;
}
 
/* 3. Ebene */
div#menu_1 ul ul ul
{
   background-color: transparent;
}
div#menu_1 ul ul ul li
{
   border-bottom: none;
   padding-top: 2px;
}
div#menu_1 ul ul ul li a,
div#menu_1 ul ul ul li div
{
   font-size: 11px;
   padding-left: 11px;
   background-image: url(../images/pil.gif);
   padding-left: 23px;
   background-position: 15px;
   background-color: transparent;
}
div#menu_1 ul ul ul li a:hover
{
   background-color: #E1E1E1;
}
div#menu_1 ul ul ul li .act
{
   color: #3F4142;
   background-image: url(../images/bullet_red.gif);
   background-repeat: no-repeat;
   padding-left: 23px;	 
}