lousypoetry: Wie bekommt man so etwas hin? (Navigationsmenü)

Hallo zusammen!

Ich hab mal eine Frage an Euch: man sieht es ja immer wieder, dass es Websites mit Navigationen gibt, die zB. untereinander zuerst ihre verschiedenen Inhalte auflisten. Fährt der Besucher dann mit der Maus über einen beliebeigen Punkt, erscheint an der Stelle wo sich der Mauszeiger befindet, ein Untermenü mit weiteren Punkten, die der Besucher anklicken kann.
Ich hab mal drüber nachgedacht und frag mich jetzt: wie bekommt man so etwas hin? Mir sind ein paar Ideen durch den Kopf gegangen, aber die sind noch etwas zusammenhanglos:

- Untermenüs als Graphiken erstellen, Punkte durch Maps verlinken
 - Funktion schreiben, die bei onmouseover bzw. onmouseout das Menü
   ein- bzw ausblendet
 - für die Position Koordinaten des Mauszeigers auslesen und Menü an
   eben diese Stelle setzen

na ja, nicht allzu viel. Wie aber schafft man es, ein Menü einzublenden, ohne dabei mit dem "Graphiktausch" zu arbeiten? Oder geht so etwas ganz anders?

Danke!

--
life's for the living. so check me tomorrow [Matthew Good Band]
  1. Hi,

    Ich hab mal drüber nachgedacht und frag mich jetzt: wie bekommt man so etwas hin?

    warum schaust Du nicht auf den Sites nach, die es machen? Dort steht es schließlich im Quellcode. Und bedenke: Gerade und besonders die Navigation muss zwingend und grundsätzlich unter ausnahmslos allen Umständen uneingeschränkt funktionieren. Also beispielsweise auch, wenn JavaScript deaktiviert oder gar nicht erst bekannt ist.

    Cheatah

    --
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. am besten bekommst du das über div-tags die alle Namen tragen hin

      Dazu schreibst dann am besten eine Funktion die solch ein div-tag ausblendet und eine die es wieder einblendet.

      und nun musst du onClick ereignisse für die div-tags definieren...
      musst dir halt jeweils genau überlegen, bei welchem klick welche sichtbarkeiten sich verändern und die alle aufführen...
      brauchst dann noch ein onClick Ereignis für den rest der seite, damit die dinger wieder zu gehn.

      hab sowas schon mal gemacht, vieleicht find ich den Code wieder, auch wenn der nicht gerade sauber war.

      1. am besten bekommst du das über div-tags die alle Namen tragen hin
        Dazu schreibst dann am besten eine Funktion die solch ein div-tag ausblendet und eine die es wieder einblendet.

        eine Funktion die div-Tags ein-/ausblendet? Wirklich das Tag? (Vielleicht ist mein Wissen auch falsch, aber das Tag wäre doch <div> oder nicht?) Wie bekommt man das denn hin? :-/

        Und noch eine Frage: ich dachte ja, es sein kein Problem, mal schnell eine Funktion zu schreiben, die stets die aktuelle Cursor-Position in der Status-Zeile ausgibt (brauch ich nur zur Kontrolle, keine Angst ;-)), aber es gelingt mit einfach nicht. Vermutlich geht es irgendwie mit

        window.status = window.event.x

        aber da hört mein Wissen auch schon wieder auf...

        1. hi,

          eine Funktion die div-Tags ein-/ausblendet? Wirklich das Tag? (Vielleicht ist mein Wissen auch falsch, aber das Tag wäre doch <div> oder nicht?) Wie bekommt man das denn hin? :-/

          in dem du die css-eigenschaften visibility oder display dynamisch per JS veränderst,
          http://selfhtml.teamone.de/javascript/objekte/style.htm

          Und noch eine Frage: ich dachte ja, es sein kein Problem, mal schnell eine Funktion zu schreiben, die stets die aktuelle Cursor-Position in der Status-Zeile ausgibt (brauch ich nur zur Kontrolle, keine Angst ;-)), aber es gelingt mit einfach nicht. Vermutlich geht es irgendwie mit
          window.status = window.event.x

          diese funktion müsstest du aber auch regelmässig aufrufen lassen, damit die anzeige sich aktualisiert.
          onMousemove im body könnte sich dafür evtl. eignen, http://selfhtml.teamone.de/javascript/sprache/eventhandler.htm#onmousemove

          gruss,
          wahsaga

          1. Hallo,

            in dem du die css-eigenschaften visibility oder display dynamisch
            per JS veränderst,

            aber das "blendet" nicht den Tag aus, sondern beeinflust nur die Anzeige/"Ausführung"/Interpretation des Tags ;-)

            Einen "Tag" kann man in dem Sinne natürlich nicht ausblenden, man kann ihn lediglich per JS entfernen bzw wieder einbauen.

            Das alles natürlich mit viel Augenzwinkern, so wie ich die Frage auch vestanden habe ,-)

            Chräcker

            1. Das alles natürlich mit viel Augenzwinkern, so wie ich die Frage auch vestanden habe ,-)

              Och, wieso? Als JavaScript-Laie kann man sich ja nie sicher sein, was alles möglich ist. Nein, mal im Ernst: Danke für die Hilfe!

              --
              life's for the living. so check me tomorrow [Matthew Good Band]
            2. Hallo.

              Einen "Tag" kann man in dem Sinne natürlich nicht ausblenden, man kann ihn lediglich per JS entfernen bzw wieder einbauen.

              Wieso nicht? Die meisten Browser blenden die Tags sogar automatisch aus -- und zumindest Opera belendet sie auf Wunsch gern auch wieder ein.
              MfG, at

              1. Hallo,

                Wieso nicht? Die meisten Browser blenden die Tags sogar automatisch
                aus --

                Den "Tag" selber? Man schaut also in den Quelltext, sieht den Tag und kann ihn nun langsam ausblenden lassen? Dann ist er weg und raus aus dem Code und nacher kann man ihn wieder einblenden lassen? (Alles mit Sicht in den Quelltext, denn sonst sieht man den "Tag" ja nicht....)

                ;-))

                Chräcker

                1. Hallo.

                  (Alles mit Sicht in den Quelltext, denn sonst sieht man den "Tag" ja nicht....)

                  Ich muss nicht in den Quelltext sehen, um die Tags zu sehen: Opera 7: View -> Style -> User Mode/Show structural elements :-)
                  MfG, at

        2. Hi,

          Dazu schreibst dann am besten eine Funktion die solch ein div-tag ausblendet und eine die es wieder einblendet.
          eine Funktion die div-Tags ein-/ausblendet? Wirklich das Tag? (Vielleicht ist mein Wissen auch falsch, aber das Tag wäre doch <div> oder nicht?) Wie bekommt man das denn hin? :-/

          Vermutlich meinte David, als er "Tag" schrieb, das "Element".

          Wie war das noch?
          Der zerstreute Professor sagte "A", schrieb "B", womit er "C" meinte, weil er es mit "D" verwechselte, obwohl eigentlich "E" richtig wäre...

          cu,
          Andreas

          --
          MudGuard? Siehe http://www.mud-guard.de/
  2. Hallo lousypoetry,

    Klick mal oben auf den Link. Wenn es sowas ist, was du willst, darfst du es dir gerne kopieren.
    Keine Angst, das ist kein fertiges Menü(copy&paste), bis du begriffen hast, wie es funktioniert und du es an deine Bedürfnisse angepasst hast, hast du soviel dazugelernt, daß du es selbst bauen könntest. ;-)

    Gruß

    Kurt

    --
    "Wenn du einen Menschen gluecklich machen willst, dann fuege nichts seinen Reichtuemern hinzu, sondern nimm ihm einige von seinen Wuenschen."  (Epikur von Samos; gr. Philosoph; 341-271 v.Chr.)
    http://elektro-dunzinger.at
    http://shop.elektro-dunzinger.at
    1. Klick mal oben auf den Link. Wenn es sowas ist, was du willst, darfst du es dir gerne kopieren.
      Keine Angst, das ist kein fertiges Menü(copy&paste), bis du begriffen hast, wie es funktioniert und du es an deine Bedürfnisse angepasst hast, hast du soviel dazugelernt, daß du es selbst bauen könntest. ;-)

      Jau, sowas meinte ich, habs mir mal eben kopiert und werds nächstes Jahr verstanden haben ;-) Nein, ist für mich noch reichlich kompliziert und ich versuch mal, es ein bisschen zu vereinfachen für den Anfang. Mal sehen, wie weit ich komme! Danke!

      --
      life's for the living. so check me tomorrow [Matthew Good Band]
  3. Ich stell mir das so vor (dafür ist allerdings PHP notwendig):

    Für den Button erster Ebene (den man also immer sieht):

    <a href="#" onmouseover="show_botton_kontaktinformationen()" onmouseout="hide_button_kontaktinformationen()"><img...></a>
    ...
    <?php
     function show_botton_kontaktinformationen()
     {
      echo "<div style="position:relative;left:10px;top:50px;"><img...></div>";
     }
    ?>

    Fragt aber nicht mich, wie die Funktion "hide_button_kontaktinformationen()" gehen soll, aber es gibt bestimmt irgendeine Möglichkeit ;-)

    Ralf