dimanche 7 décembre 2014

software dynamisches Menü mit JavaScript/CSS3

Hallo,



ich habe derzeit bei meiner Webseite ein kleines Problem.



Ich bastel grad an einer Art eigenem kleinen CMS - man braucht nur PHP-Dateien mit dem Inhalt erstellen, schon funktioniert die Seite im Groben

Es gibt ein horizontales Dropdownmenü. Da drin sind so einträge wie z.B. "Blog", "Forum", "Home" usw. Insgesamt kommen wir auf ca. 10 Einträge. Entsprechend ist das Menü auch lang. Ich habe es derzeit so gestaltet, dass bei kleinerer Fenster-/Bildschirmgröße das Menü anders angezeigt wird - in der Leiste steht bei Fenstergrößen < 900px nur ein Button "Menü", wenn man drauf klickt erscheint das Menü als eingeblendetes DIV.



Da das normale Menü aber ziemlich lang ist, muss ich den Breakpoint schon bei 900px setzen. Und bei 900px sieht der einzelne Button nicht sehr schön aus. Ich hätte es gern so wie z.B. woltlab es gemacht hat: http://www.woltlab.com. Verkleinert mal euer Browserfenster (horizontal). Ihr werdet merken, die Menüleiste mit "Woltlab", "produkte", "community" etc. wird kleiner, und wenn nicht mehr alles ins bild passt wird daneben ein menü-icon angezeigt. Wenn man da draufklickt, erscheint eine Liste mit den fehlenden Einträgen. die einträge werden stückweise in die Liste genommen, wenn der Platz nicht mehr ausreicht.



So hätte ich das auch gern, nicht dass mit einmal alle Menüeinträge in diese Liste, die durch den Button sichtbar wird, verschwinden, sondern stückweise.



Das Problem ist ja auch dass ich nicht weiß wie viele Menüeinträge das Menü letzendlich hat. Es soll ja ein dynamisches System werden.





software dynamisches Menü mit JavaScript/CSS3

Aucun commentaire:

Enregistrer un commentaire