Portfolio-Grid: Ein Foto-Magnet Menü in Webflow bauen

Level:
Fortgeschritten 👍

In diesem Webflow Tutorial bauen wir zusammen ein Foto-Magnet Text Menü. Ein Bild wird zuerst mit einem Hover-Effekt eingeblendet und verfolgt dann den Mauszeiger.

Dieser moderne Ansatz wird auch häufig als Projekt-Übersicht auf einer Portfolio Startseite verwendet.

Passend dazu gehts hier zu meiner Portfolio Challenge auf Patreon:

https://www.patreon.com/posts/50987059

Das Ergebnis hier anschauen:

https://webflow-lernen.webflow.io/image-hover-mouse-movement-effect

Projekt klonen:

Direkt im Webflow Designer öffnen

Kapitel:

00:00 - Intro
01:28 - Aufbau & Struktur
03:17 - Wichtige Einstellungen Bild & Maske
05:47 - Tracking Mouse Movement einrichten
07:46 - Bild Hover Animation anlegen
16:45 - Ergebnis
17:03 - Outro