Tutorial: Bilder Grid Scroll Animation von Apple.com nachbauen
In diesem Webdesign Tutorial bauen wir in Webflow eine Scroll Animation von apple.com, die dem Seitenbesucher zuerst drei große Bilder im Viewport zeigt, die sich dann während des Scrollens in eine Bilder-Collage einordnen und sich zudem leicht Parallax verschieben. Klinkt kompliziert? Da die Herangehensweise und auch der Denkprozess bei solchen Tutorials wichtig ist, habe ich in diesem Video mal darauf geachtet, nichts vorzubereiten und alle Probleme und Fehler drin zu lassen.
Als responsive Lösung auf Tablet und Mobile habe ich Flexbox auf wrap und alle Bilder auf 50% Breite gestellt. So bekommen wir insgesamt vier Reihen, was ok ist, da Webseiten auf Mobile Devices eher hochkant betrachtet werden und dadurch mehr Platz in der Höhe entsteht.
