CSS basiertes sliding menu - SEO Links

  • Lange suche brachte mit bisher nichts...


    Ich suche ein Script für ein hauptsächlich css-basiertes menu.


    Vorraussetzungen:


    1. Alle links werden rein in HTML angelegt, sprich sind in jeder Seite des Projektes ist die komplette Navigationsstruktur komplett vorhanden.


    2. Dynamische effekte wie "hover link1 navebene1" fährt mittels js link1 navebene 2 aus. vertikales sliden aller darunter liegenden links.


    3. Jeder Subnavpunkt kann zusätzlich via css sichtbar gestellt werden. Soll heissen: wenn einmal ein hover in irgendeinem browser nicht funktionieren sollte: klick auf Link -> nächste seite -> betreffendes submenu via id oder class mit css sichtbar geschaltet. Am besten wohl über parent selektor, somit bliebe der scriptkern unangetastet und einfach als Bibliothekselement auf vielen Seiten einbaubar.


    Ich habe viele Menus gefunden, die fesch sliden und nett ausschauen. Alle basieren auf JS...auch die Links. So etwas suche ich nicht. Die Seite braucht perfektes SEO. Alle Links müssen als Klartext in HTML eingegeben werden. JS soll nur die Sichtbarkeit der Submenus / slideeffekte realiseren.


    Jemand ne Idee?

  • hoi hero-master,


    das ist schon mal sehr schön vom html source her.
    auch die js funktion ist schön klein.
    das eingebundene jquery mag ich nicht. ich will einfach nicht glauben dass ein dermassen komplexes 55kb javascript nötig ist um einen solchen effekt hinzubekommen.


    gibts das ganze vielleicht auch noch voll vertikal, so dass alles unter dem aktuellen hover-link nach unten rutscht?


    sollte dann ähnlich dem mootools menu rechts auf
    http://www.esl.ch/de/sprachauf…tudenten-sprachreisen.htm
    aussehen. aber eben ohne 92kb js.

  • Schau dich mal auf der Website von JQuery um, da gibt es auch solch ein Menu.
    Ansonsten wüsste ich nicht, ob es solche Menus mit geringer Größe gibt, so ein geslide kostest eben en wenig KBs. Wenn du auf Ladegeschwindigkeit gehen willst, solltest du dir ein Menu ohne solches reingeslide suchen, eben einfache Drop-Down-Menus ;)

  • Ja, hab auch noch nix ohne Jquery gefunden. Sache ist sind nun mal nette 56 kB. Ich arbeite gerade mit einer mischung aus reinem UL LI CSS: da kommt man natürlich mit hover nicht an alle Punkte bei mehrfacher Verschachtelung.


    wenn mann dann noch die collapsible div von dynmaicdrive einbaut (Jquery min plus 10kb js-ergänzungen) kommt das hier raus:


    besser, aber es sind immernoch einige navpunkte schwer zu erreichen. da wegen dem hover je nachdem welcher subnav egrade offen ist man nie genau sagen kann, ob jetzt ein subnav nach oben oder nach unten scrollt gibts auch schwierigkeiten bei der navigation.


    das einzige was mir da einfällt ist onmouseover vergessen und stattdessen mit klick auf plus.


    was mein ihr?

  • Moin :)

    was mein ihr?


    Ich halte solche Navigationen, die aus mehreren Ebenen bestehen generell recht unübersichtlich. Noch unübersichtlicher und nerviger finde ich es, wenn man erst 3 Mal in der Navigation rumklicken muss, bevor man Inhalt bekommt.
    Ich würde das "statischer" machen und jeweils nur eine Subnavi verwenden.
    Du fährst bspw. mit der Maus über "Sprachaufenthalte Englisch", dann öffnet sich eine Subnavi mit den Unterpunkten.
    Darin würde ich dann keine Subnavi wieder direkt einbauen, sondern würde dann Inhalt zeigen. In dem Inhatsbereich ist dann irgendwo seperat noch eine Subnavi mit den einzelnen Stationen und im Inhaltsbereich dann auch bereits eine kurze Einleitung zu den unterschiedlichen Standpunkten.


    Ein User will schnell Inhalt sehen und sich nicht 10 Minuten mit der Navigation aufhalten, bevor er Inhalte bekommt.
    Das ist meine Meinung und meine Erfahrung :)

  • pflichte ich uneingeschränkt bei. mouesover fällt flach weil das zeug eben manchmal nach oben, manchmal nach unten scrollt.


    das "dynamische" ist nur eine ergänzung. auf jeder betreffenden unterseite ist dann der jeweilige subnav da. war die grundvorrausstzung: dass die seite vollkommen statisch ansteuerbar ist.

  • nein, leider nicht. hatt ich auch schon gesehen...dazu wird meines vertikal...dh punkte unten drunter können müssen je nach hover nach oben ODER unten ausgefahren werden, siehe demo oben...aber ich denke ich habs jetzt soweit.


    das einzige was noch zickt: IE5 (ca 3%) schmeisst js-fehler:


    line 20 char 9837 object doesn't support the property or method.
    navigation fährt wender ein noch aus, ist immer voll da.
    bei jedem klick auf ein plus der gleiche fehler.