Hallo,

irgendwas stimmt da nicht.

Wenn du dir deinen HTML-Output genau ansiehst, müsste dir auffallen, dass die 2. Ebene nicht von der 1. Ebene umklammert wird. Das schließende li-Tag der 1. Ebene müsste meiner Ansicht nach NACH der 2. Ebene kommen. Erstens ist das von der semantischen Logik her richtig, und zweitens kannst du sonst mit dem CSS gar nicht vernünftig auf die 2. Ebene selektieren.

Komischerweise ist aber dein TS richtig, denn du benutzt "wrapItemAndSub". Und das verstehe ich nicht. HTML und Ts passen nicht zusammen. Kannst du das nochmal überprüfen?

Ansonsten: setze mal "expAll = 0", dann verschwindet die 2. Ebene, wenn nicht ihre 1. Ebene aktiviert ist.

Beste Grüße
Stefan Padberg



Am 19.05.2014 19:16, schrieb Robert Stadler:
Hallo
Ich habe ein Problem mit der zweiten Ebene meines Menü. Ich möchte das
vertikale Menü erst einblenden, wenn die 2. Ebene des Menü angeklickt
wird. Das konnte ich auch so umsetzen. Was aber das Problem ist, wenn
das Menü eingeblendet wird, erscheint es, aber nicht mit dem richtigen
Style. Irgendwas mache ich beim CSS oder im HTML oder vielleicht an
einem anderen Ort falsch. Geht dies überhaupt so mit der 2. Ebene? Kann
mir jemand helfen? Besten Dank schon mal.

TS:

subparts.navbalk = HMENU
   subparts.navbalk {
     entryLevel = 1
         wrap = <ul class="navbalk"> | </ul>
   # Die erste Ebene:
         1 = TMENU
         1.expAll = 1
         1.NO.wrapItemAndSub = <li> | </li>
   # CUR-Zustand der ersten Ebene:
         1.CUR = 1
         1.CUR < .1.NO
         1.CUR.ATagParams = class="active"
   # ACT-Zustand der ersten Ebene:
         1.ACT = 1
         1.ACT < .1.CUR

   # Die zweite Ebene:
         2 = TMENU
         2.wrap = <ul class="navbalk"> | </ul>
         2.NO.wrapItemAndSub = <li> | </li>
   # CUR-Zustand der zweiten Ebene:
         2.CUR = 1
         2.CUR < .2.NO
         2.CUR.ATagParams = class="active"
   }

HTML:

<div id="header_navbalk">
      <div id="navbalk">
      <!-- [NAVBALK] -->        <ul class="navbalk">
          <li><a href="#">Button 1</a></li>
          <li><a href="#">Button 2</a></li>
          <ul class="navbalk">
            <li><a href="#">Websiteplanung</a></li>
            <li><a href="#">Oberfläche</a></li>
            <li><a href="#">Funktionalität</a></li>
            <li><a href="#">Inhalte</a></li>
          </ul>
          <li><a href="#">Websiteplanung</a></li>
          <li><a href="#">News</a></li>
          <li><a href="#">Kontakt</a></li>
        </ul>
      </div>    </div>
CSS:

div#header_navbalk {
  position: relative;
  border-bottom:1px solid #d19197;
  color:white;
  float: left;
  width: 188px;
  height: 200px;
}

div#header_navbalk  a  {  color:black;
}
navbalk ul {
    width: 10em;
    margin: 0; padding: 0.2em 0.8em 0.8em;
    background-color: none;
  }
  * html .navbalk ul {  /* Korrekturen fuer IE 5.x */
    width: 11.6em;
    w\idth: 10em;
    padding-left: 0;
    padd\ing-left: 0.8em;
  }
  .navbalk ul li {
    list-style: none;
    margin: 0.4em; padding: 0;
  }

  .navbalk ul a, .navbalk ul span {
    display:block;
    padding: 0.2em;
    text-decoration: none;
    /*border: 1px solid black;*/
    border-left-color: white; border-top-color: white;
    background-color: #BDD2FF;
  }
  * html .navbalk ul a, * html .navbalk ul span {
    width: 100%;    /* Breitenangabe fuer IE 5.x */
    w\idth: 8.8em;  /* Breitenangabe fuer IE 6 */
  }
  .navbalk ul a:hover, .navbalk ul span {
    border-color: white;
    border-left-color: black; border-top-color: black;
    background-color: #CEDDFE;
  }

Viele Grüsse
Robert

_______________________________________________
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german

Antwort per Email an