Skorpion: dhtml menü +

Hallo Zusammen
ich habe folgendest Problem und komme irgendwie nicht weiter.

Ich möchte gerne das Beispiel des DHTML Menü von Selfhtml
http://de.selfhtml.org/dhtml/beispiele/navigation.htm

mit einem vertikalen listen menü verbinden

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Horizontal Drop Down Menus</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="drop_down.js"></script>
<style type="text/css">
@import "style3.css";
</style>
</head>
<body>
<ul id="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">About</a>
    <ul>
      <li><a href="#">History</a></li>
      <li><a href="#">Team</a></li>
      <li><a href="#">Offices</a></li>
    </ul>
  </li>
  <li><a href="#">Services</a>
    <ul>
      <li><a href="#">Web Design</a></li>
      <li><a href="#">Internet Marketing</a></li>
      <li><a href="#">Hosting</a></li>
      <li><a href="#">Domain Names</a></li>
      <li><a href="#">Broadband</a></li>
    </ul>
  </li>
  <li><a href="#">Contact Us</a>
    <ul>
      <li><a href="#">United Kingdom</a></li>
      <li><a href="#">France</a></li>
      <li><a href="#">USA</a></li>
      <li><a href="#">Australia</a></li>
    </ul>
  </li>

</ul>

</body>
</html>

Kann mir vielleicht jemand weiterhelfen?
Danke schon im Vorraus

  1. Die Formatierung, ob das Menü horizontal oder Vertikal aufgebaut ist, hängt allein vom CSS ab.

    Gruß, LX

    --
    RFC 2324, Satz 7 (Sicherheit): Jeder, der zwischen meinem Kaffee und mir steht, gilt als unsicher.
    1. Die Formatierung, ob das Menü horizontal oder Vertikal aufgebaut ist, hängt allein vom CSS ab.

      Genau. Stichwort "Listamatic".

      Hotti

      --
      Wenn der Kommentar nicht zum Code passt, kann auch der Code falsch sein.
      1. Die Formatierung, ob das Menü horizontal oder Vertikal aufgebaut ist, hängt allein vom CSS ab.

        Genau. Stichwort "Listamatic".

        Hotti

        ich möchte aber das Listenmenü gerne mit dem dhtml menü vereinen nur habe ich derzeit keinen plan wie ich das mache

        1. Om nah hoo pez nyeetz, Skorpion!

          ich möchte aber das Listenmenü gerne mit dem dhtml menü vereinen nur habe ich derzeit keinen plan wie ich das mache

          Dazu müsstest du mal schildern, welches dein Kenntnisstand ist, was du schon alles versucht hast ...

          btw: das Beispiel ist semantisch nicht mehr auf dem aktuellen Stand (<br>, keine Auszeichnung als Liste) btw2: das Beispiel verwendet javascript, es muss also für Nutzer ohne JS eine Alternative eingebaut werden

          Hast du dir mal den Quelltext angeschaut?

          Das eigentliche Menü befindet sich innerhalb eines divs namens "nav". Wenn du das Div "navLinks" durch deine Liste ersetzt, bist du schon auf einem guten Weg. Die endgültige Gestaltung musst du dann mit CSS machen.

          Matthias

          --
          http://www.billiger-im-urlaub.de/kreis_sw.gif
          1. Om nah hoo pez nyeetz, Skorpion!

            ich möchte aber das Listenmenü gerne mit dem dhtml menü vereinen nur habe ich derzeit keinen plan wie ich das mache

            Dazu müsstest du mal schildern, welches dein Kenntnisstand ist, was du schon alles versucht hast ...

            btw: das Beispiel ist semantisch nicht mehr auf dem aktuellen Stand (<br>, keine Auszeichnung als Liste)
            btw2: das Beispiel verwendet javascript, es muss also für Nutzer ohne JS eine Alternative eingebaut werden

            Hast du dir mal den Quelltext angeschaut?

            Das eigentliche Menü befindet sich innerhalb eines divs namens "nav". Wenn du das Div "navLinks" durch deine Liste ersetzt, bist du schon auf einem guten Weg. Die endgültige Gestaltung musst du dann mit CSS machen.

            Matthias

            Genau das habe ich versucht, den Teil des "Listenmenü"
            in den von Dir genannten teil einzufügen. Doch leider hat das nicht zum Erfolg geführt.

            Das sah dann bei mir so aus.

            <div id="Nav">
             <img src="navigation.gif" width="250" height="450" border="0" alt="">
             <div id="NavLinks">

            <ul id="nav">
              <li><a href="#">Home</a></li>
              <li><a href="#">About</a>
                <ul>
                  <li><a href="#">History</a></li>
                  <li><a href="#">Team</a></li>
                  <li><a href="#">Offices</a></li>
                </ul>
              </li>
              <li><a href="#">Services</a>
                <ul>
                  <li><a href="#">Web Design</a></li>
                  <li><a href="#">Internet Marketing</a></li>
                  <li><a href="#">Hosting</a></li>
                  <li><a href="#">Domain Names</a></li>
                  <li><a href="#">Broadband</a></li>
                </ul>
              </li>
              <li><a href="#">Contact Us</a>
                <ul>
                  <li><a href="#">United Kingdom</a></li>
                  <li><a href="#">France</a></li>
                  <li><a href="#">USA</a></li>
                  <li><a href="#">Australia</a></li>
                </ul>
              </li>

            </ul>

            </div>
            </div>

            1. Om nah hoo pez nyeetz, Skorpion!

              Genau das habe ich versucht, den Teil des "Listenmenü" in den von Dir genannten teil einzufügen. Doch leider hat das nicht zum Erfolg geführt.

              Definiere "nicht zum Erfolg geführt"!

              Noch einmal:

              • Was waren deine Gestaltungsversuche?

              • Wie ist dein Kenntnisstand bezüglich CSS?

              • Wo können wir dich abholen um dir auf deinem Weg der Erkenntnisfindung behilflich zu sein?

              Zitiere bitte sinnvoll, nicht alles.

              Matthias

              --
              http://www.billiger-im-urlaub.de/kreis_sw.gif
              1. Om nah hoo pez nyeetz, Skorpion!

                Genau das habe ich versucht, den Teil des "Listenmenü"
                in den von Dir genannten teil einzufügen. Doch leider hat das nicht zum Erfolg geführt.

                Definiere "nicht zum Erfolg geführt"!

                Noch einmal:

                • Was waren deine Gestaltungsversuche?

                • Wie ist dein Kenntnisstand bezüglich CSS?

                • Wo können wir dich abholen um dir auf deinem Weg der Erkenntnisfindung behilflich zu sein?

                Zitiere bitte sinnvoll, nicht alles.

                Matthias

                Nun ich bin kein Profi bezügtlich HTML, CSS und noch weniger Javascript.
                Ich habe mir meine einfachen kenntnisse über Selfhtml bzw. an fertigen Seiten, Beispielen erworben.

                Ich versuche wenn ich etwas mache so übersichtlich wie möglich zu gestalten.
                Das heißt für mich, das ich dazu übergegangen bin die CSS Formatierung in einer seperaten Datei zu machen und nicht auf der HTML Seite, und dann fast alles auskommentiert damit es für mich später wieder nachvollziehbar ist. Da ich nicht wirklich oft versuche etwas zu Gestalten.

                Was ich in meinem Fall benötige, ist die Verschmelzung der Anfangs genannten Dinge.
                Ich könnte die einzelnen Beispiele in sich weiterführen und auch weiter verfeinern aber momentan fehlt mir die zündende Idee wie ich beide Sachen zueinander bringe.
                Ich will auch nicht ausschließen das ich vielleicht einen kompletten gedankenfehler habe.

                1. Om nah hoo pez nyeetz, Skorpion!

                  Ich will auch nicht ausschließen das ich vielleicht einen kompletten gedankenfehler habe.

                  Wenn du soetwas machen möchtest, musst du dafür sorgen, dass alle externen Resourcen auch zur Verfügung stehen. Im konkreten Fall heißt das, du brauchst die Grafiken navigation.gif und navigation_back.gif sowie die JS-Bibliothek dhtml.js. Dann sollte es so aussehen.

                  Matthias

                  --
                  http://www.billiger-im-urlaub.de/kreis_sw.gif
                2. Hallo,

                  was hast du an

                  Zitiere bitte sinnvoll, nicht alles.

                  nicht verstanden?
                  Und solange du gezielten Rückfragen wie z.B.

                  • Was waren deine Gestaltungsversuche?
                  • Wie ist dein Kenntnisstand bezüglich CSS?
                  • Wo können wir dich abholen um dir auf deinem Weg der Erkenntnisfindung behilflich zu sein?

                  weiterhin so ausweichst bzw. sie völlig ignorierst und stattdessen nur wiederholst, was du gern hättest, ist es nahezu unmöglich, dir dabei zu helfen.

                  Ich versuche wenn ich etwas mache so übersichtlich wie möglich zu gestalten.

                  Das ist eine sehr lobenswerte Absicht.

                  Das heißt für mich, das ich dazu übergegangen bin die CSS Formatierung in einer seperaten Datei zu machen

                  Richtig so.

                  und dann fast alles auskommentiert damit es für mich später wieder nachvollziehbar ist.

                  Auskommentiert? Wohl nicht. Mit _aus_kommentieren meint man normalerweise, Code in Kommentare zu setzen, um ihn unwirksam zu machen. Du meintest wahrscheinlich, dass du deinen Code mit Kommentaren ergänzt, ihn also kommentierst (nicht "aus-"). Und das ist gut so - das lassen viele einfach bleiben, weil ja "alles klar ist". Ja, im Moment des Schreibens mag einem klar sein, was der Code soll. Aber drei Wochen später? Ein Jahr später? Deswegen: Behalte diese Gewohnheit ruhig bei. Und denk auch daran: Das Wichtige am Kommentar ist, nicht unbedingt zu beschreiben, was eine Anweisung tut (das geht tatsächlich meist aus dem Code hervor), sondern welcher Sinn dahinter steckt.

                  Was ich in meinem Fall benötige, ist die Verschmelzung der Anfangs genannten Dinge.
                  Ich könnte die einzelnen Beispiele in sich weiterführen und auch weiter verfeinern aber momentan fehlt mir die zündende Idee wie ich beide Sachen zueinander bringe.
                  Ich will auch nicht ausschließen das ich vielleicht einen kompletten gedankenfehler habe.

                  Ja, kann gut sein. Zunächst mal: Die etwas veraltete Abkürzung DHTML steht für "Dynamisches HTML", und damit meinte man vor ungefähr zehn Jahren (oder noch mehr), dass man HTML mit Javascript aufbohrt, um so irgendwelche Effekte zu erzielen, die HTML allein nicht bietet.
                  Für die meisten Navigationsmenüs ist Javascript aber weder notwendig noch als zwingende Voraussetzung wünschenswert. Effekte wie aufklappende Menüs oder Darstellungsänderungen beim Hovern lassen sich mit CSS allein auch realisieren. Deswegen hat Matthias dir gestern schon sein Beispiel verlinkt, damit du es studieren und anpassen kannst - und dabei das antiquierte JS-basierte Menü von SELFHTML entsorgen.

                  So long,
                   Martin

                  --
                  I do take my work seriously and the way to do that is not to take yourself too seriously.
                    (Alan Rickman, britischer Schauspieler)
                  Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
  2. Om nah hoo pez nyeetz, Skorpion!

    meinst du soetwas?

    PS: Das ist nicht für die Veröffentlichung gedacht, muss deshalb nur im FF so aussehen wie gewollt und funktioniert für IE < 7 nicht.

    Matthias

    --
    http://www.billiger-im-urlaub.de/kreis_sw.gif
    1. Om nah hoo pez nyeetz, Skorpion!

      meinst du soetwas?

      PS: Das ist nicht für die Veröffentlichung gedacht, muss deshalb nur im FF so aussehen wie gewollt und funktioniert für IE < 7 nicht.

      Matthias

      Ja so ein Menü in der Art meine ich aber in verbindung mit dem dhtml menü von selfhtml