Dropdown-Menüs zu erstellen, ist immer wieder ein Spaß, besonders für Anfänger. Außerdem muss in der Regel immer wieder (fast) der gleiche Code erstellt und angepasst werden. Und je nach Anforderung soll das Menü verschieden platziert und mit ebenso verschiedenen Verhaltensweisen ausgestattet werden. Für die Entwicklung der Basis gibt es ein Framework zwecks Arbeitserleichterung.
Es handelt sich um das Free CSS Drop-Down Menu Framework. Dieses Framework bringt alles mit, was es für Dropdown-Menüs braucht, Browserkompatibilität, flexibles Layout, einfache Einbindung in Projekte und validen Code. Außer dem Javascript-Schnippsel für den IE6 (Hier bleibt die Wahl zwischen jQuery und Scriptaculous) wird ausschließlich CSS verwendet.
Horizontales Dropdown-Menü mit Flickr-Theme
Layout und Styling der Menüs sind konsequent getrennt. Letzteres ist über ein Theme in Form einer unabhängigen CSS-Datei realisiert. So können die Layouts ohne Eingriff wieder verwendet werden und lediglich das Aussehen muss den eigenen Wünschen entsprechend verändert werden. Der Autor spricht von 10 bis 15 Minuten zur Erstellung eines eigenen Themes auf Basis eines bestehenden. Einkalkuliert werden sollte allerdings noch die Zeit für die Orientierung bei der ersten Verwendung.
Dropdown-Menü von Links nach Rechts
Neben den simplen und den erweiterten Grundthemes stehen bereits 4 Themes mit den Designs von Flickr, NVidia, Adobe und MTV zur Verfügung. Weitere Themes werden gesammelt. Das Framework wird weiterentwickelt und läuft unter der GPL als Open-Source, kann also auch frei weiterentwickelt und weitergegeben werden. ™
Weitere Beiträge:
- 5 Ideen wie Sie wiederkehrende Arbeitsschritte & Marketingprozesse gewinnbringend im Internet automatisieren! Ein Gastbeitrag von Robert Nabenhauer.
- Wachstum durch Facebook-Gewinnspiele: Wie Sie über Facebook virale Gewinnspiele & eine schnell wachsende Fangemeinde aufbauen
- Wie Sie aufmerksamkeitsstarke Prelaunch-, Launch- und Relaunch-Szenarien aufbauen und dabei Viralität, Spannung & Kaufkraft erzeugen
- Wie Sie waschechte Iphone-Apps mit PhoneGAP entwickeln, um am lukrativen App-Markt mitzumischen
- Wie Sie Ihr Shop-Sortiment so präsentieren, dass der Kunde in Zukunft mehr findet und eher kauft! Ein Gastbeitrag von Nicolas Schmidt-Voigt.
- 11 faszinierende BuddyPress-Plugins, um kostenlos aus WordPress ein soziales Netzwerk zu zaubern
- Die Vorboten einer neuen Internet-Industrie! Ein exklusiver Rückblick & Blick hinter die Kulissen der Clickbank-Exchange 2011 in New York.
Loading ...
Geniales Framework.
Werde ich mir wohl heute mal genauer ansehen.
*thumbsup*
Yeah, das sieht echt interessant aus! Danke für den Tipp!
Jetzt muss man sich das nicht mehr aus den Seite direkt rausziehen sondern bekommt es geliefert, sehr schön. Aber so ein Menü zu bauen kann auch sehr stressig sein
Sehr nett, habe mich erst gestern mit solchen Menü’s beschäftigt, kommt ja sehr gelegen
Schaut echt gut aus, danke für den tollen Tipp!
Joh, das is et
). Schon lange nach so einer Lösung gesucht. Endlich mal ein Menü das ohne Probleme auf vielen Plattformen funktioniert und wohl intensiv weiterentwicklet wird.
Gruss tom
Die Vorlagen sind ganz gut. Hab sie in diversen Browsern getestet. Falls es aber noch Personen gibt, die auf den IE 5.5 Rücksicht nehmen, werden bei diesem Script keine Lösung gefunden haben.
Gruss Miranda
Hallo
Funktioniert super. Hab da nur ein Problem. Meine Seite ist aus Tabellen aufgebaut. Und sobald das Menu in einer Tabelle ist, funktioniert das Menu nicht mehr richtig.
Grüsse Flow
Finde das alles auch sehr interessant, jedoch stolpere ich hier über etwas. Habe die nvidia-Vorlage genommen.
Ich wollte unter einen Menüpunkt noch 2 Untermenüpunkte realisieren. Innerhalb von Frontpage kein Problem, wenn ich jedoch Browservorschau mache, dann klappt das Teil (Untermenü) weder beim Fox noch beim IE auf. Abgespeichert und rein über die Browser angesteuert ändert auch nichts.
Warum?