Dropdown hinzufügen als data-type

[krug_s]

Hallo wie kann ich Dropdown Menu erstellen, wenn ich data-type als Navigation benutze??


Zb. unter Mitglieder will ich jetzt noch 2 zusätzliche Punkte resp. Seiten wie Download und Profil.

<li>
               <a data-type="mitglieder" href="#0">Mitglieder</a>
           </li>

Bei mir funktioniert es nicht, ich habe probiert einfach zusätzlich noch 2 <li> Elemente hinzufügen...aber es klappt nicht. Was mache ich falsch?


Hier wäre meine Navigation Code..

<nav class="cd-filter">
            <ul>
                <li class="placeholder">
                    <a data-type="start" href="#0">Navigation</a> <!-- Mobil-auswählen -->
                </li>

                <li>
                    <a class="selected" data-type="start" href="#0">Startseite</a>
                </li>

                <li>
                    <a data-type="news" href="#0">News</a>
                </li>

                <li>
                    <a data-type="verein" href="#0">Forum</a>
                </li>
               
                <li>
                    <a data-type="geschichte" href="#0">Gästebuch</a>
                </li>
               
                <li>
                    <a data-type="mitglieder" href="#0">Mitglieder</a>
                </li>
               
                <li>
                    <a data-type="gallerie" href="#0">Gallerie</a>
                </li>
               
                <li>
                    <a data-type="kontakt" href="#0">Kontakt</a>
                </li>
            </ul>
        </nav>

 

[SpiceLab]

Unabhängig von data-type erhält ein Dropdown-Menü in der Listenstruktur jede weitere/tiefere Menüebene durch Einbettung (Verschachtelung) einer Liste im Obermenüpunkt <li></li>:

<nav class="cd-filter">
  <ul><!-- Start 1. Menüebene -->
    ...
    <li>
      <a data-type="mitglieder" href="#0">Mitglieder</a>
      <ul><!-- Start 2. Menüebene -->
        <li>...</li>
        <li>...</li>
      </ul><!-- Ende 2. Menüebene -->
    </li>
    ...
  </ul><!-- Ende 1. Menüebene -->
</nav>

[edit]Tipp-Ex[/edit]​