Thomas: Vertikales Pop-Up Menü erstellen?

Hallo,
ich möchte gerne ein vertikales Menü erstellen. Wenn ich auf einen Link mit der Maus komme, öffnet sich rechts daneben ein Untermenü.
Ich glaube so etwas geht nur mit Javascript und nicht nur mit CSS. Das Menü sollte aber unter allen gängigen Browsern laufen.

Wer kann mir ein solches Beispiel geben oder sagen wie ich eine Anleitung dafür finde.

Mal anders gefragt. Wie erstellt Ihr eure Menüs, bzw. Menüs die noch Untermenüs haben?

Gruss
Thomas

  1. hi,

    ich möchte gerne ein vertikales Menü erstellen. Wenn ich auf einen Link mit der Maus komme, öffnet sich rechts daneben ein Untermenü.
    Ich glaube so etwas geht nur mit Javascript und nicht nur mit CSS.

    Jein.
    Ginge mit CSS schon - nur im IE natürlich (noch) nicht.
    Der braucht dann einen Workaround per Javascript.

    Ein gutes Beispiel findest du in SELFHTML, Dynamische CSS-Navigation für moderne Browser

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. Hallo,

      Ein gutes Beispiel findest du in SELFHTML, Dynamische CSS-Navigation für moderne Browser

      Wie kann ich denn aus dem horizontalen ein Vertikales Menü erstellen?

      Wie erstellst du denn deine Navigationsmenüs wenn Untermenüs erforderlich sind?

      Gruss
      Thomas

      1. hi,

        Wie kann ich denn aus dem horizontalen ein Vertikales Menü erstellen?

        Und dem du versuchst zu _verstehen_, wie dort das "horizontale" bewerkstelligt wurde - und es dann analog für's "vertikale" umsetzt.

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. Hallo,
          wie erstellst Du denn nun deine Menüs, wenn diese Untermenüs haben?

          Alle Links direkt in der Navigation sichtbar oder wie?

          Gruss
          Thomas

          1. hi,

            wie erstellst Du denn nun deine Menüs, wenn diese Untermenüs haben?

            Was für eine Antwort willst du jetzt hören - "kommt drauf an"?

            Alle Links direkt in der Navigation sichtbar oder wie?

            Kommt drauf an.

            gruß,
            wahsaga

            --
            /voodoo.css:
            #GeorgeWBush { position:absolute; bottom:-6ft; }
    2. Hi,

      Ginge mit CSS schon - nur im IE natürlich (noch) nicht.

      bist Du sicher? Es wurde nach Ausklappen per Klick gefragt. Ich habe das noch nicht ausprobiert, aber könnte mir vorstellen, daß zumindest der Opera hier Probleme mit :focus bekäme.

      freundliche Grüße
      Ingo

      1. hi,

        Es wurde nach Ausklappen per Klick gefragt.

        Wo?

        Ich habe

        Wenn ich auf einen Link mit der Maus komme, öffnet sich rechts daneben ein Untermenü.

        schon so interpretiert, dass das übliche Aufklappen beim hovern gemeint war (und habe darüber hinweg gesehen, dass es dann kein Link sein darf, der die Unterpunkte enthält).

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. Hi,

          Es wurde nach Ausklappen per Klick gefragt.

          Wo?

          Oops, stimmt - sorry.
          Liegt wohl daran, daß ich kurz zuvor eine solche Anfrage beantwortet hatte...

          freundliche Grüße
          Ingo

          1. Hallo.

            Liegt wohl daran, daß ich kurz zuvor eine solche Anfrage beantwortet hatte...

            Bei MacSelf sind ja auch gerade Navigations-Menü-Wochen.
            MfG, at

        2. Hallo Wahsaga,
          wie würdest du die Sache angehen, bzw. wie würdest Du dieses Menü erstellen?

          Hier mal kurz die erforderlichen Links:
          <!--
          <ul id="primary-nav" class="menuList">
          <li class="menubar"><a href="null">Home</a></li>
          <li class="menubar"><a href="null">Philosophie</a></li>
          <li class="menubar"><a href="null">Mein Traumhaus</a>
           <ul>
           <li><a href="null">Fertigung</a></li>
           <li><a href="null">Beispiel</a></li>
           <li><a href="null">Beispiel</a></li>
           </ul>
          </li>
          <li class="menubar"><a href="null">Leistungen</a>
           <ul>
           <li><a href="null">Holzhausbau, Holzrahmenbau</a></li>
           <li><a href="null">Allgemeiner Holzbau</a></li>
           <li><a href="null">Klassische Zimmerei</a></li>
           <li><a href="null">Aufstockung, Bauen im Bestand</a></li>
           <li><a href="null">Dacharbeiten</a></li>
           <li><a href="null">Planung, Statik, Finanzierung</a></li>
           </ul>
          </li>
          <li class="menubar"><a href="null">Bauen mit Holz</a></li>
          <li class="menubar"><a href="null">Zertifizierung</a>
           <ul>
           <li><a href="null">Einfamilienhäuser</a></li>
           <li><a href="null">Zimmermannsarbeiten</a></li>
           <li><a href="null">Öffentliche Bauten</a></li>
           </ul>
          </li>
          <li class="menubar"><a href="null">Presseinformationen</a></li>
          <li class="menubar"><a href="null">Referenzen</a>
           <ul>
           <li><a href="null">Holzhausbau</a></li>
           <li><a href="null">Kundenstimmen</a></li>
           </ul>
          </li>
          <li class="menubar"><a href="null">News</a></li>
          <li class="menubar"><a href="null">Impressum</a></li>
          <li class="menubar"><a href="null">Kontakt</a></li>
          </ul>
          -->

          Gruss Thomas

          1. hi,

            wie würdest du die Sache angehen, bzw. wie würdest Du dieses Menü erstellen?

            Auch wenn du mich noch hundert Mal persönlich ansprichst - mehr, als dass du dir das genannte Beispiel bei SELFHTML anschauen, es verstehen und dann analog von horizontalem Ausklappen zu vertikalem umbauen sollst, habe ich dazu nicht zu sagen (vorerst - bei konkreten Problemen kann man natürlich wieder versuchen, dir bei der Ursachensuche zu helfen).

            gruß,
            wahsaga

            --
            /voodoo.css:
            #GeorgeWBush { position:absolute; bottom:-6ft; }
  2. hier noch 2 weitere Beispiele:

    http://demo.raibledesigns.com/struts-menu/cssVertical.jsp;jsessionid=a0khUR_w9AR6oiiF4S
    http://www.phoenity.com/newtedge/horizontal_nav/

  3. z.b:
    http://more.ericmeyeroncss.com/projects/06/

    Unter
    http://more.ericmeyeroncss.com/dloads/
    Project 6 herunterladen und den Quelltext analysieren.

    mfg