Cooler Scrolleffekt bei dern Untermenüs

**RainerG** · 19.10.2011, 10:09

Beim Stöbern auf der Internetseite 'meines' Vereins ist mir der sehr schöne Scroll-Effekt bei den Untermenüs aufgefallen: http://www.hannover96.de/CDA/aktuelles.html

Gehe ich z. B. auf Verein, wird erst einmal das Untermenü einbeblendet, wechsel ich dann z. B. auf Fans, wird das aktuelle Untermenü nach unten raus gescrollt und das neue Fans von oben reingesrcollt.

Die Seite ist leider Typo3.

Gibt es für Contao eine Erweiterung, die einen solchen Scrolleffekt bewerkstelligen kann?

**pmmueller** · 19.10.2011, 10:53

Ist wirklich ein schönes Menü, und vor allem leicht bedienbar.

Auf den ersten Blick sieht das aus wie jQuery. Mit TYPO3 selbst hat das eher weniger zu tun. Links die vertikale Navigation enthält übrigens die gleichen Links, falls jemand JavaScript ausgestellt hat.

**RainerG** · 19.10.2011, 11:08

Zitat von pmmueller

... Mit TYPO3 selbst hat das eher weniger zu tun. ...

Das stimmt schon, aber wenn es Contao gewesen wäre, mit der die Seite gemacht wurde, dann wäre die Umsetzung ja um ein vielfaches einfacher

- deswegen auch das leider

.

**andrea$** · 19.10.2011, 12:11

die ganze Website ist sehr schön gemacht!

ich würde fast sagen: leider setzt contao auf mootools und nicht auf jQuery, was imho mehr Möglichkeitn bietet als mootools.

**MacKP** · 19.10.2011, 12:15

Naja, an sich ist das doch nur ein Slider...
Könnte man mit Mootools genauso machen.
Könnte man sogar mit CSS3 so machen...
Rest ist CSS.

Viele Grüße

**psren** · 19.10.2011, 12:30

Zitat von andrea$

leider setzt contao auf mootools und nicht auf jQuery, was imho mehr Möglichkeitn bietet als mootools.

das bietet mindestens gleich viele Möglichkeiten. Nur jQuery ist verbreiteter und deshalb gibt es da mehr 'Schlüsselfertige' Möglichkeiten.

**andrea$** · 19.10.2011, 12:47

Zitat von psren

das bietet mindestens gleich viele Möglichkeiten. Nur jQuery ist verbreiteter und deshalb gibt es da mehr 'Schlüsselfertige' Möglichkeiten.

vielleicht wollte ich das damit sagen....

**ofriedrich** · 20.10.2011, 17:03

Ist recht simpel gemacht, schaut aber nett aus. Sowas ist auch problemlos mit Mootools möglich.

Die Untermenüs sind alle einfach in einen absolut positionierten DIV-Container mit fester Höhe und overflow hidden gepackt und werden so einfach mit margin-top von oben nach unten geschoben.

**tblumrich** · 20.10.2011, 18:18

Dafür sollte doch idealerweise die Erweiterung Megamenu passen. Ich meine sogar, man kann bei der Animation der Submenüs zwischen drop und fade wählen!

Gruß
Thomas

**ATLAS** · 21.10.2011, 06:15

Das hat zwar nicht unmittelbar mit der Frage zu tun, aber anmerken würde ich es doch einmal. Man darf schon über Sinn und Zweck solcher doppelt gemoppelten Navis nachdenken. Ich versteige mich auch oft in solch schöne Effekthascherei. Meist stelle ich fest, das braucht kein Mensch und verwirrt nur.
Wenn man die gleiche Energie in eine kreative Sitemap steckt, hat man, so glaube ich, wesentlich mehr getan in punkto Übersicht.

**RainerG** · 21.10.2011, 08:25

Zitat von ATLAS

Das hat zwar nicht unmittelbar mit der Frage zu tun, aber anmerken würde ich es doch einmal. Man darf schon über Sinn und Zweck solcher doppelt gemoppelten Navis nachdenken.

Wenn Du JS ausschaltest, ist es nicht mehr doppelt gemoppelt ;-). Dann macht das linke Menü Sinn, aber das könnte man dann bei aktivierten JavaScript ausschalten per CSS über JS (oder?).
Von daher sicher nicht ganz elegant gelöst.

**Sascha** · 30.12.2011, 09:54

Aus meiner Sicht hat das Menü folgenden Nachteil: wenn man z.B. bei "AWD Arena" auf den ersten Unterpunkt "Arena-Info" klicken will, kommt man bei direktem Weg (also Mauszeiger diagonal nach unten ziehen) immer leicht über den vorherigen Hauptmenüpunkt. Dass führt dazu das der Inhalt neu slidet.

legalstuff · 02.01.2012, 11:30

Die Seite von Hannover 96, ist in der Tat gut gemacht (vom Technischen her).

Hier wurden jetzt einige Argumente gebracht, aber aus meiner Sicht nicht wirklich eine Lösung.

Für mich stellen sich hier einige Fragen:
1. wie könnte ich (Ich kann kein PHP oder JS programmieren) überhaupt prüfen, ob JS eingeschaltet ist, bzw. mit welcher Erweiterung (nicht mit der html5boilerplate, zu kompliziert und nur für Programmier) ist das machbar?

2. bei der genannten 96er Seite, wird recht gut, das Fallback gemacht (für User mit No-Script z.B.), über das zweite Vertikale Menü.
Besonders gut finde ich, dass bei Auswahl eines Untermenüpunktes, der "Pfeil" in diesem Fall, beim Top-Menü stehen bleibt, so dass der User sieht, welchen Punkt er als Oberkategorie ausgewählt hatte.

3. Wie kann man denn nun, ein solches Slider-Menü machen?
Das Megamenü ist ja in der Hauptsache für einzelne Artikel gedacht, oder habe ich das falsch verstanden?
(So zumindest in der Anleitung, zumal ich auch kein Grid-System nutze)

zu 2. habe ich folgendes inzwischen herausgefunden:
Dieser von mir angesprochene Pfeil(von unten auf den Menüpunkt), wird durch ein kpl. BG-Bild realisiert, das nur zu einem Teil eingeblendet wird, halt dem gerade aktiven Menüpunkt (der ja auch unterschiedlich lang sein kann), durch angabe der Positionen auf dem BG-Bild.
Ob das auch mit Moo_tools geht, oder wie hier mit JS/JQuery nur geht?