Portfolio Aufbau: Sticky Projekt-Teaser Scroll Animation in Webflow

Level: Fortgeschritten

Scroll-Animation

ressourcen

* AFFILIATE LINK

Details

Level

Fortgeschritten

Datum

July 12, 2026

Autor

Jonas Arleth

Blog Post

Ein weiteres Layout, welches du in deinem Portfolio als Projektübersicht einsetzen könntest. Wir bauen zusammen in Webflow ein Splitscreen-Design, bei dem links die Texte durch scrollen und rechts die Projektbilder parallel dazu sticky immer im Viewport bleiben und sich je nach Projekt-Teaser und Scroll-Position austauschen.

Die Scroll Animation dazu legen wir direkt in Webflow an. Denk dran, dass du die Interaktion anpassen musst, sobald mehr Teaser hinzukommen!

Kapitel:

00:00 – Intro
01:17 – Aufbau in Webflow
06:27 – Scroll Interaktion anlegen
09:07 – Ergebnis

Mehr Content

Portfolio Grid mit Teaser Animation in Webflow erstellen

Wir bauen zusammen eine dezente Scroll-Into-View Animation, welche Teaser Bilder rein animiert, sobald sie in den sichtbaren Bereich des Seitenbesuchers kommen.

Video

Kategorie

Scroll-Animation

Skill

Einfach

Portfolio Bilder Collage Scroll Animation

Lerne wie du eine Collage aus vielen Bildern während des scrollens ran oder raus zoomen kannst. Das Ganze nutze ich ganz oben in einer meiner Portfolio Case Studies.

Video

Kategorie

Scroll-Animation

Skill

Einfach