Bernd: Navigation

Hallo,

ich möchte mir eine Navigation erstellen und stehe jetzt vor der Frage "Wie am besten?".
Man findet im Netz ja sehr viel darüber wie man es mit JavaScript lösen kann.

Ich hab mir überlegt das ganze in Tabellenform zu lösen, indem ich jeder Spalte einen <div> mit id "verpasse" mit onmouseover- und onmouseout-Effekten style.display="none" und style.display="true".

Das ist zwar etwas mehr Arbeit, aber würde bestimmt auch funktionieren.

Nun meine Frage. Ist meine Idee mit der Tabelle eurer Meinung nach anwendbar oder ratet ihr mir davon lieber ab?

MFG
Bernd

  1. Hi Bernd,

    ich denke mal, das hängt von dem Aufbau deiner Seite ab. Könntest doch auch einfach eine mit CSS formatierte Liste oder ähnliches nutzen :-)

    Gruß
    Ben

    1. Hallo Ben,

      daran hatte ich noch gar nicht gedacht. Da könnt ich ja ganz auf JS verzichten.
      Ich hab viele Haupt- mir vielen Unterkadegorien auf meiner Seite, sodass eine normale Linkliste zu lang wird. Deswegen möchte ich jetzt wie vorhin erwähnt eine vertikale Navigationsleiste einbringen.
      Womit würde ich da am besten voran kommen? Meine Idee, CSS, oder eine der vielen JS-Scripte im Netz?

      MFG
      Bernd

      1. Hi,

        Ich hab viele Haupt- mir vielen Unterkadegorien auf meiner Seite, sodass eine normale Linkliste zu lang wird. Deswegen möchte ich jetzt wie vorhin erwähnt eine vertikale Navigationsleiste einbringen.

        hast Du schon einmal darüber nachgedacht, daß hierfür Zwischenseiten für jeden Hauptlink mit einer eingebundenen individuellen Subnavigation für die jeweilige Rubrik die übersichtlichste Lösung ist? Und das funktioniert auch noch völlig ohne Javascript.

        freundliche Grüße
        Ingo

        1. Hallo,

          nein, hab ich noch nicht. Habe nun aber schon mit CSS und JS angefangen. Aber falls dies nicht nach meinen Wünschen ausgeht werd ich es so machen wie du vorgeschlagen hast. Über eine Tabelle wird es doch zu aufwendig und der Quelltext viel zu unübersichtlich.

          MFG
          Bernd

          1. Hi,

            nein, hab ich noch nicht. Habe nun aber schon mit CSS und JS angefangen.

            Berücksichtige dabei aber auch eine Alternative für Besucher ohne Javascript.
            Hier sehe ich eigentlich nur drei Möglichkeiten:
            1. eine Sitemap -> nicht sehr komfortabel
            2. die Subnavigation erst über Javascript ausblenden -> da hier sämtliche Subnavigationen angezeigt werden, dürfte das Ergebnis einer vermutlich unübersichtlichen Sitemap entsprechen und darüber hinaus dem Layout nicht besonders gut stehen
            3. die Hauptmenünkte auf eine - schon angesprochene - Zwischenseite verlinken -> mMn die beste Möglichkeit, wobei ich mich dann frage, ob der Javascriptzusatz tatsächlich einen Mehrwert bietet.

            freundliche Grüße
            Ingo

              1. die Hauptmenünkte auf eine - schon angesprochene - Zwischenseite verlinken -> mMn die beste Möglichkeit, wobei ich mich dann frage, ob der Javascriptzusatz tatsächlich einen Mehrwert bietet.

              Das müßte dann in einen <noscript>-Tag hinein, oder sehe ich das falsch?

              Grüße
              bernd

              1. Hi,

                Das müßte dann in einen <noscript>-Tag hinein, oder sehe ich das falsch?

                ja.
                Es gibt folgende Alternativen zur Aktivierung eines Javascgriptmenüs:
                1. <a href="javascript:funktion()"> -> nicht wirklich sinnvoll.
                2. <a href="#" onmouseover="funktion()"> -> schon besser, aber ohne Javascript sinnlos. Auch ein noscript-Bereich würde daran nichts ändern, daß ein Klick auf diesen Menüpunkt - mit oder ohne Javascript - nichts auslöst außer in den meisten Browsern einem Sprung an den Seitenanfang.
                3. <a href="zwischenseite.html" onmouseover="funktion()"> -> hier gelangt man durch Klick zur Zwischenseite, egal ob Javascript aktiviert ist oder nicht.

                freundliche Grüße
                Ingo

            1. hi,

              1. die Hauptmenünkte auf eine - schon angesprochene - Zwischenseite verlinken -> mMn die beste Möglichkeit, wobei ich mich dann frage, ob der Javascriptzusatz tatsächlich einen Mehrwert bietet.

              wobei du eine reine CSS-lösung dann vermutlich nicht mehr machen kannst, denn dazu müsstest du ja die links auf untermenü-ebene in die links auf der ebene darüber verschachteln, damit :hover oder :focus hier wirken können.
              da bleibt dann wirklich nur noch javascript, um einen vom link _unabhängigen_ bereich mit den unterlinks einzublenden.

              gruß,
              wahsaga

              --
              I'll try being nicer if you'll try being smarter.
              1. Hi,

                wobei du eine reine CSS-lösung dann vermutlich nicht mehr machen kannst

                die scheidet doch wegen der Unfähigkeit des IE, :hover auf andere Elemente als Links anzuwenen, ohnehin aus.

                denn dazu müsstest du ja die links auf untermenü-ebene in die links auf der ebene darüber verschachteln, damit :hover oder :focus hier wirken können.

                und diesen Gedankengang verstehe ich nun wieder nicht. Vielleicht hattest Du meine Vorschlag aber auch falsch verstanden; weiter unten habe ich das nochmal präzisiert.

                freundliche Grüße
                Ingo

                1. hi,

                  wobei du eine reine CSS-lösung dann vermutlich nicht mehr machen kannst
                  die scheidet doch wegen der Unfähigkeit des IE, :hover auf andere Elemente als Links anzuwenen, ohnehin aus.

                  nein, die scheidet nicht unbedingt aus.

                  • CSS-menü für fähige browser,
                  • per javascript nur im IE _dynamisch_ gesetzte eventhandler wie onmouseover etc., die das aufklappen realisieren,
                  • stylesheet für IE ohne JS, dass das ganze menü aufgeklappt darstellt

                  gruß,
                  wahsaga

                  --
                  I'll try being nicer if you'll try being smarter.
                  1. Hi,

                    nein, die scheidet nicht unbedingt aus.

                    • CSS-menü für fähige browser,
                    • per javascript nur im IE _dynamisch_ gesetzte eventhandler wie onmouseover etc., die das aufklappen realisieren,
                    • stylesheet für IE ohne JS, dass das ganze menü aufgeklappt darstellt

                    in dieser Kombination hast Du natürlich recht. Obwohl der Nutzen des CSS-Menüs hier doch z.Z. noch sehr gering sein dürfte. Wer Javascript deaktiviert, nutzt in den meisten Fällen den IE - und bekommt dann ein nicht gerade sinnvolles Layout.

                    freundliche Grüße
                    Ingo

  2. hi,

    ich möchte mir eine Navigation erstellen und stehe jetzt vor der Frage "Wie am besten?".

    wenn du wirklich die "beste" möglichkeit suchst, dann berücksichtige bens vorschlag, es über eine liste zu lösen - denn so eine ansammlung von links, die man gemeinhin als "navigation" bezeichnet, ist ja genau das - eine liste.
    schöne beispiele dazu unter http://css.maxdesign.com.au/listamatic/.

    auf einsatz von javascript solltest du möglichst verzichten - und wenn nicht, dann doch wenigstens dafür sorgen, dass die navigation auch ohne JS nutzbar bleibt.

    gruß,
    wahsaga

    --
    I'll try being nicer if you'll try being smarter.
    1. Hallo,

      danke! Das beantwortet meine unten gestellte Frage.

      MFG
      Bernd

      1. Hallo,

        ich habe mir die Seite mal angeschaut, sieht super aus, was man mit CSS alles machen kann.
        Jedoch suche ich noch nach etwas anderem. Ich möchte erst wenn die Mouse über dem Link ist die Unterkadegorien einblenden. Deswegen dacht ich ja auch an die Tabellenlösung. Ist sowas auch mit reinem CSS ohne JS möglich?

        MFG
        Bernd

        1. hi,

          Ich möchte erst wenn die Mouse über dem Link ist die Unterkadegorien einblenden. Deswegen dacht ich ja auch an die Tabellenlösung.

          wenn du in einer tabelle bestandteile dynamisch ein- und ausblenden kannst - dann wird das ja sicher auch mit verschiedenen listenebenen klappen.

          Ist sowas auch mit reinem CSS ohne JS möglich?

          ja.
          allerdings ist der IE zu blöd dafür, für diesen braucht es also ein javascript-lösung (oder eine für den IE um JS ergänzte CSS-lösung).

          gruß,
          wahsaga

          --
          I'll try being nicer if you'll try being smarter.
          1. wenn du in einer tabelle bestandteile dynamisch ein- und ausblenden kannst - dann wird das ja sicher auch mit verschiedenen listenebenen klappen.

            Danke für den Tip, so werd ich es versuchen. Da die Seite für den IE gedacht ist, werd ich wie du gesagt hast eine Verbindung aus CSS und JS nutzen.

            MFG
            Bernd

        2. Hallo Bernd,

          Ich möchte erst wenn die Mouse über dem Link ist die Unterkadegorien einblenden.

          :hover wird dir dabei helfen, schau dir beispielsweise http://www.meyerweb.com/eric/css/edge/menus/demo.html an.

          Grüße
            David

          --
          >>Nobody will ever need more than 640k RAM!<<
          1981 Bill Gates
        3. Hi

          Ich möchte erst wenn die Mouse über dem Link ist die
          Unterkadegorien einblenden.

          Dieses Menü funktioniert so wie du willst mit JS. Wer
          kein JS hat/unterstützt, bei dem ist halt alles ausgeklappt.
          Aber funktioniert...
          http://www.porjes.com/jsmenus/jssidemenu4.html

          Musst halt noch ein wenig mit CSS herumspielen, um den
          Mouseover-Effekt zu erreichen.

          Gruss
          chlori

  3. Hi

    Nun meine Frage. Ist meine Idee mit der Tabelle eurer
    Meinung nach anwendbar oder ratet ihr mir davon lieber ab?

    Es gibt viel elegantere Möglichkeiten als Tabellen
    missbrauchen und mit Divs füllen (warum eigentlich?)...

    Eine Liste macht meistens Sinn. Für die Gestaltung kann
    dir CSS helfen.

    Gruss
    chlori