TheSas

Portfolio · Interaktionen

TheSas.dev

Das Portfolio, das Sie gerade entdecken: Projekte, technische Details und neun Animationen zum Ausprobieren mit eigenen Bildern.

Dieselben Animationen bewegen das Kontaktformular und die beiden Showcase-Bilder.

TheSas · CSS + Web Animations

Showcase

Zwei Bilder. Neun Arten, sie zu bewegen. Jetzt sind Sie dran.

Die Plätze tauschen

Bewegungen reduzieren ist aktiv: Effekte sind deaktiviert.

Bild A
Bild A
Bild B
Bild B

Systemübersicht

Vom Klick zur Bewegung

Jeder Effekt berücksichtigt die aktuellen Positionen beider Elemente und endet in einem stabilen Layout.

  1. 01

    Auswählen

    • Ein Button, ein Effekt
  2. 02

    Animieren

    • Web Animations APIPositionen auf der Seite messen
  3. 03

    Zur Ruhe kommen

    • Temporäre Transformationen entfernen

Ein paar Worte von mir

Der Text folgt.

Weiter