Sie befinden sich hier: Dokumentation > JYAML für Joomla! 1.7+, 2.5 > Erweiterte Joomla! Einstellungen > Dropdown Menü

Dropdown Menü

Dropdown-Menüs (oder auch Flayout-Navigation genannt) gibt es mittlerweile wie Sand am mehr. Jedoch gestaltet sich eine allgemein Layoutunabhängige Umsetzung nach wie relativ schwierig.

Warum in JYAML nun ein eigenes Dropdown-Menü Konzept mitgeliefert wird, liegt daran, weil bei fast allen Lösungen keine oder nur eingeschränkte Tastaturnavigation möglich ist (Stichwort: Zugänglichkeit - Accessibility). Hier wurde also der Fokus auf die Zugänglichkeit gerichtet. Außerdem funktioniert das aufklappen der Untermenüs auch vollständig ohne Javascript, soweit der Browser dies unterstützt.

Die Tastaturnavigation funktioniert über die Tab- und Shift+Tab Taste (Standard) sowie auch mit den Pfeiltasten.

Um das Dropdown-Menü zu aktivieren muss in einem Menü Modul das Alternative Layout "dropdown" ausgewählt werden. In jedem Menü Modul sind zusätzliche Optionen verfügbar um das Verhalten zu beeinflussen. Ein teil dieser Optionen kann zusätzlich pro Menüpunkt verändert werden, um z.B. die Aufklapp-Richtung für einen bestimmten Menüpunkt zu ändern.

Layout Datei: /html/mod_menu/dropdown.php
Stylesheet: navigation.dropdown.css

Um das Layout anzupassen, sehen Sie sich die Beispiele im Stylesheet an.

Tip's und Hinweise:

Mit dem Dropdown-Menü und der Funktion "Module in Menüpunkt einfügen" können Sie sogar so genannte Megamenüs realisieren.
Damit auf jeder Seite alle Untermenüs aufklappbar sind müssen sie in den Moduleinstellungen die Option "Untermenüeinträge anzeigen" (bzw. Show Sub-menu Items) auf Ja stellen.

Nachfolgend eine Auflistung aller verfügbaren Einstellungen.

Standard Orientierung

Hier kann man die Ausrichtung (vertikal, horizontal) sowie Orientierung (links, rechts, oben, unten) für alle Menüpunkte konfigurieren. Das Dropdownmenü erkennt automatisch, wenn kein Platz mehr im Browserfenster ist und wechselt die Horizontale Ausrichtung von rechts nach links bzw. links nach rechts automatisch. Die Vertikale Ausrichtung wird nicht automatisch beeinflusst, da es sonst je nach Layout Überlagerungen der Untermenüs entstehen.

Diese Option ist auch pro Menüpunkt im Joomla! Menümanager verfügbar.

Lineares/Mehrspaltiges Untermenü

Wenn aktiviert, wird das Untermenü auf die volle Breite ausgedehnt und alle direkten Untermenüs sind automatisch in einem Mehrspalten Raster aufgeteilt.

Animations Effekt (Anzeigen/Verbergen)

Bestimmt den Animations-Effekt der beim Anzeigen und Verbergen von Untermenüs verwendet werden soll.

Es sind mehrere Kombinationen aus Slide und Fade Effekten möglich.

Untermenü Deckkraft

Bestimmt die Deckkraft der Untermenüs. Diese Einstellung entspricht der CSS-Eigenschaft "opacity".

Verzögerung Untermenü ausblenden (ms)

Bestimmt die Verzögerungszeit in Millisekunden, wann das Untermenü ausgeblendet werden soll, wenn man mit der Maus oder Tastatur das Untermenü verlässt.

Dauer des Einblenden Effekts (ms)

Bestimmt die Dauer des festgelegten Animation-Effekts in Milisekunden, wenn das Untermenü eingeblendet wird.

Übergangs-/Wechseleffekt beim anzeigen

Bestimmt den Übergangs-Effekt (Art des Animation-Effekts) beim Anzeigen eines Untermenüs.

Diese Effekte basieren auf den Fx.Transitions von MooTools. Eine Demo der Effekte finden Sie hier: http://mootools.net/demos/?demo=Transitions

Dauer des Ausblenden Effekts (ms)

Bestimmt die Dauer des festgelegten Animation-Effekts in Millisekunden, wenn das Untermenü ausgeblendet wird.

Übergangs-/Wechseleffekt beim verbergen

Bestimmt den Übergangs-Effekt (Art des Animation-Effekts) beim Ausblenden eines Untermenüs.