Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Fundstück

WAIT! Animate: Schneller zu anschaulichen CSS-Animationen

    WAIT! Animate: Schneller zu anschaulichen CSS-Animationen

(Screenshot: waitanimate.eggbox.io)

Wait! Animate ist ein einfaches Tool um Animationen zu erstellen und zu konfigurieren, für das du kein JavaScript Know-How benötigst.

Es gibt bereits einige CSS-Funktionen, die es möglich machen, die Animationsbewegungen und -zeiten manuell anzusprechen. Wer sich aber nicht in die Materie einarbeiten oder einfach schnell zum finalen Code kommen will, sollte sich WAIT! Animate mal anschauen.

WAIT! Animate

Mit WAIT! Animate könnt ihr ganz einfach die Keyframes der Animation berechnen, Verzögerungen zwischen den Animationen einfügen und coole Effekte in kürzester Zeit erstellen – alles ohne JavaScript.

Maßgeschneiderte Animationen mit WAIT! Animate. (Screenshot: http://waitanimate.eggbox.io/)
Maßgeschneiderte Animationen mit WAIT! Animate. (Screenshot: waitanimate.eggbox.io)

Das Tool zeigt euch einige Beispielanimationen, bei denen ihr die Wartezeit manuell einstellen könnt und euch den Code anschließend in die Zwischenablage kopiert. Keine Lust auf fertige Animationen? Kein Problem, mit dem Konfigurator könnt ihr euch von der Animationsdauer über die Bewegung auf der X- und Y-Achse bis hin zur Pause zwischen den Animationen alles manuell einstellen und euch den Code einfach kopieren.

Hinter der Website Wait! Animate steckt EggBox, die neben WAIT! Animate noch weitere coole Projekte wie Punch Trump und ein jQuery-Plugin für Auswahlboxen haben.

via waitanimate.eggbox.io

Finde einen Job, den du liebst

Schreib den ersten Kommentar!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden