Animation

Scroll-Animation für lange Screenshots in deinem Portfolio

Level:
Einfach 👌
Das Video kann nur angezeigt werden, wenn Cookies erlaubt sind.
Cookies akzeptieren und Medien laden

Wir bauen zusammen eine tolle Parallax Blur Scrolling Animation, die sich hervorragend in deinem Portfolio verwenden lässt. Gerade als Webdesigner macht man von seinen Kunden-Projekten häufig längere Screenshots, die sich mit diesem Scroll-Effekt sehr gut in Szene setzen lassen. Dabei greife ich auf einen Blurry-Hintergrund zurück, welcher im Prinzip das gleiche Bild ist, wie im Vordergrund, durch seinen Unschärfe-Filter aber verschwommen wirkt und dem ganzen eine tolle Stimmung verleiht. Das Projekt gibts wie immer kostenlos zum Klonen in meinen Webflow Showcases! PS: Falls du dich fragst, ob es aus Performance-Sicht für eine Ladezeit nicht nachteilig ist, ein so großes Bild gleich zweimal auf einer Seite zu integrieren, kann ich dich beruhigen. Das Hintergrundbild greift auf die gleiche Quelle zurück wie das scharfe Vordergrundbild. Du kannst es also so oft du willst auf einer Seite einbinden – es wird vom Browser nur einmal geladen.

Ergebnis anschauen
Icon für einen externen Link
Projekt im Webflow Designer öffnen
Icon für einen externen Link