Wer kennt das nicht: Die Navigation einer bestehenden Site ändert sich und nun muss die Änderung bei wirklich jeder Seite eingetragen werden. Nervig und zeitaufwändig!
Eine Menge Zeit spart man sich wenn man die navi per include einbindet. Diese Methode ist relativ simpel und effektiv. Man führt die Änderung an einer Datei durch und fertig.
Man hat zwar noch den Deppenlink (Link der auf sich selber zeigt), aber was soll’s.
In diesem, auch für PHP-Vollpfosten geeigneten Tutorial beschreibe ich euch, wie ihr die navi includet und trotzdem den Deppenlink vermeidet. Weiterlesen
Ein horizontales Menü dessen Links teilweise zwei,- und/oder dreizeilig sind, lassen sich mithilfe einer CSS-Tabelle recht gut gestalten.
Die Vorteile der Tabellendarstellung bestehen darin, dass die Tabellenzellen einer Zeile immer gleich hoch sind und sich immer auf die gesamte Breite der Tabelle verteilen. Es gibt keinen Umbruch der Tabellenzellen
und die Inhalte fließen nicht über. Weiterlesen
Der etwas kompliziertere Fall eines grafischen Menüs habe ich schon erklärt.
Hier folgt nun der etwas einfachere Fall, wo der Linktext ganz normal dasteht und die Grafik nur den Hintergrund bildet. Weiterlesen
Sehr beliebt sind auch Menüs, die sich mit Tabs organisieren. Vielleicht ist euch in diesem Zusammenhang schon mal der Begriff Sliding Doors (Schiebetürentechnik) untergekommen.
Der Nachteil dieser Technik ist, das man pro Linkzustand jeweils zwei Grafiken braucht.
Diese Hintergrundbilder waren so weit ineinander geschoben, das sie sich beim Zoomen der Seite wie eine Schiebetür immer weiter auseinanderzogen.
Wir verwirklichen das Ganze mit CSS-Sprites (engl. für Kobolde, Geist), d.h. wir benötigen nur eine Grafik für alles. Diese wird einfach per background-position an die richtige Stelle geschoben. Weiterlesen
In meinem letzten Artikel Navi – Flyout 1 habe ich beschrieben, wie man ein einfaches Flyout-Menü mit zwei Ebenen erstellt.
Hier werde ich euch zeigen wie man eine dritte Ebene hinzufügt, d.h. ein Submenü bekommt ein weiteres Submenü, ein Sub-Submenü sozusagen. Weiterlesen
Bei einem einfachen Layout mit zwei Spalten soll die Navigation in ein Flyout-Menü umgewandelt werden Weiterlesen
Tutorial zur Erstellung eines einfachen Dropdown-Menüs mit XHTML/CSS und etwas Javascript für den IE 6. Weiterlesen
Ziel dieses Tutorials ist es, ein horizontales Menü zu erstellen, welches komplett aus Hintergrundgrafiken besteht. Damit das Menü bei abgeschalteten Grafiken noch funktioniert, wird der Linktext ganz normal in den Quelltext geschrieben.
Die Grafiken werden mithilfe der Image Replacement Technik nach Gilder/Levin über den Linktext geschoben. Weiterlesen