Lena: Hover+aufklappbares Menü

Hallo,

bin noch Anfängerin und hab endlich mit aller Mühe und Not ein Menü mit Hover-Effekt zusammengebracht. Möchte daraus aber ein auch ein aufklappbares Menü erzeugen.

Bitte um Hilfe!

Lena

  1. Hallo Lena.

    bin noch Anfängerin und hab endlich mit aller Mühe und Not ein Menü mit Hover-Effekt zusammengebracht.

    Und wie? (Code, Beispielseite)

    Möchte daraus aber ein auch ein aufklappbares Menü erzeugen.

    So in etwa? (Für Gehhilfen unbedingt weiter Scrollen.)

    Einen schönen Mittwoch noch.

    Gruß, Ashura

    --
    sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
    „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
    [HTML Design Constraints: Logical Markup]
    1. Danke - mein Code:

      <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3c.org/tr/1999/rec-html401-19991224/loose.dtd">
      <html><head>
      <title>
      </title>
      <meta http-equiv=content-type content="text/html; charset=windows-1252">
      <style type=text/css>

      div#clink {
       left: 3px;
       font: 16px arial, sans-serif;
       width: 80px;
       position: absolute;
       top: 17px;
       height: 60;
      }
      div#clink a {
          border-right: #ffffff 3px solid; padding-right: 10px;
          display: block; padding-left: 10px; border-left-width: 0px;
          background: #f9eec8; border-bottom-width: 0px;
          padding-bottom: 5px; margin: 0px 0px 2px; color: #625b55;
          padding-top: 5px; text-align: center; text-decoration: none; }

      div#clink a:hover {
          border-right: red 3px dashed; background: #ffff00; color: #dd0000
      }

      .Stil1 {font-size: 9px}
      </style>

      </head>
      <body bgcolor=white>

      <div id=clink>

      <span class="Stil1"><a href="#">Home</a>
        <a href="#">Leistungen</a>
        <a href="#">Links</a>
        <a href="#">Kontakt</a></span>

      </div>
      </body></html>

      1. Hallo Lena.

        <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3c.org/tr/1999/rec-html401-19991224/loose.dtd">

        Dieser DOCTYPE ist ungültig.

        left: 3px;
        font: 16px arial, sans-serif;
        width: 80px;

        Möchtest du statt dank px einzementierter Größen nicht lieber relative Maßeinheiten wie em oder % verwenden?

        position: absolute;

        „Absolute Positionierung ist für wenig Fortgeschrittene absolut nicht geeignet (vermutlich kommt daher die Bezeichnung ;-)).“
        [Orlando]

        Warum hier die absolute Positionierung und damit der Verzicht auf ein flexibles Layout?

        height: 60;

        Diese Höhenangabe ist aufgrund der fehlenden Maßeinheit ungültig.

        <body bgcolor=white>

        Ich bitte dich. Du hast CSS zur Verfügung stehen.

        <div id=clink>

        <span class="Stil1"><a href="#">Home</a>
          <a href="#">Leistungen</a>
          <a href="#">Links</a>
          <a href="#">Kontakt</a></span>

        </div>

        Du möchtest eine Liste von Links? Dann mache doch eine Liste von Links.

        In jedem Fall sollte dir das von mir verlinkte Beispiel bereits weiterhelfen.

        Einen schönen Mittwoch noch.

        Gruß, Ashura

        --
        sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
        „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
        [HTML Design Constraints: Logical Markup]
        1. Hallo,

          <body bgcolor=white>
          Ich bitte dich. Du hast CSS zur Verfügung stehen.

          ja, außerdem wäre eine Farbangabe im Klartext schön, also
           background-color: #FFF;
          anstatt
           background-color: white;
          Okay, "white" ist noch eine Farbe, die ziemlich eindeutig zu lesen und zu verstehen ist, aber das ist bei vielen anderen benamsten Farben leider nicht so.

          So long,
           Martin

          --
          "Life! Don't talk to me about life!"
            (Marvin, the paranoid android in Douglas Adams' "The Hitchhiker's Guide To The Galaxy"
          1. hi,

            ja, außerdem wäre eine Farbangabe im Klartext schön, also
            background-color: #FFF;
            anstatt
            background-color: white;

            Also ein Wort wie white ist für dich kein Klartext, eine Hex-Zeichenkette aber schon ...?

            Lass mich raten, du schaust dir auch immer "die Matrix nur noch kodiert an, geht nicht anders" ...?

            gruß,
            wahsaga

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

              Also ein Wort wie white ist für dich kein Klartext, eine Hex-Zeichenkette aber schon ...?

              ein Wort wie z.B. "white" ist, wie ich schon schrieb, eine der wenigen Ausnahmen. Aber schon bei "silver" wüsste ich ohne Farbtabelle nicht, wie das definiert ist und könnte es nur mit Phantasie erahnen; aber schon bei "lime", "teal" oder "mauve" wäre ich völlig hilflos und bar jeder Ahnung, wie die Farbe wohl aussehen soll. Bei einer Angabe wie z.B. #EFC sehe ich dagegen auf einen Blick: Aha, ein helles, blasses Gelb mit einem leichten Grünstich.

              Lass mich raten, du schaust dir auch immer "die Matrix nur noch kodiert an, geht nicht anders" ...?

              Hm, da kann ich leider nicht ganz folgen. :-(

              Ciao,
               Martin

              --
              Nicht jeder, der aus dem Rahmen fällt, war vorher im Bilde.
          2. Hello out there!

            ja, außerdem wäre eine Farbangabe im Klartext schön, also
            background-color: #FFF;
            anstatt
            background-color: white;

            Das 'white' u.a. Farbangaben (für Kundige der englischen Sprache) Klartext ist, '#FFF' für Unkundige der additiven Farbmischung und des Hexadezimalsystems dagegen Hieroglyphen, deutete wahsaga ja schon an.

            Dass das bei _dir_ andersrum ist, deutetest du ja schon an: Farbe Weis und Weiß wie Wissen... ;-)

            See ya up the road,
            Gunnar

            --
            “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)