January 2021

Eigene Dropdown Navigations-Animation in Webflow erstellen - Mega Menü

Level:

Fortgeschritten 👍

In diesem Webflow Tutorial zeige ich dir, wie du einfach und schnell eine individuelle Animation für deine Website Navigation bauen kannst.

„Webflow Interaction” ermöglicht dir als Webdesigner in allen Bereichen deines Layouts zusätzlich individuelle Animationen und Interaktionen hinzuzufügen. So wie in meinem Beispiel hier die Dropdown Navigation.  Und da Webflow ein visueller Editor ist, siehst du deine Einstellungen und Animationen auch sofort. Auch super als Prototyping Tool geeignet!

Schau dir die fertige Navigation hier an:
https://nav-mega-dropdown.webflow.io

Projekt klonen:

Direkt in Webflow öffnen

Kapitel:

0:00 – Intro
0:29 – IST-Zustand und Inspirationen
1:36 – feste Höhe einstellen
2:52 – On Hover Interaktion erstellen
4:30 – Fade-In für Elemente erstellen
5:20 – Fade-In Delay einstellen
7:56 – Hover Out erstellen
10:42 – Endergebnis