Web Animations - Bildwechsler arbeitet nicht synchron

[Richard Rüfenacht]

Hallo Matthias

Es wird nicht die erste Animation endlos wiederholt, sondern die zweite Animation startet mit den Einstellungen, die am Ende der ersten Animation vorliegen usw.

Ja, da muss ich mal schauen, ob ich evtl die Animation mit einem negativen Wert für delay bereits in der Mitte starten soll.

Da bin ich gespannt auf das Ergebnis. Ich meine, dass hier die Logik des Stapelns der Bilder entscheidend ist. Mit z-Index zu arbeiten wäre einfacher, funktioniert bei mir aber nur bedingt.

Das ist ein entscheidender Unterschied zu Animationen, die z.B. mit Adobe-Animate auf einer Zeitleiste erstellt werden.

Ja, und das ist einer der Vorteile der WAAPI (Web Animations API), dass man die Durchläufe in einer Animation festlegen und dann mit variablen Werten mehrfach durchführen kann.

Also: Die WAAPI kann nichts, was z.B. Adobe-Animate nicht auch kann, aber sehr vieles halt nicht oder nur sehr arbeitsaufwändig. Mir ist schon klar, dass es hier nicht darum geht, sondern darum die WAAPI zu verstehen.

Ich nehme die WAAPI zur Kenntnis, begeistert bin ich nicht. Da stehe ich nicht allein, das macht auch deutlich, wer sich dafür einsetzt oder auch nicht.

Das klingt jetzt wie eine versteckte Kritik …

Nein! Ganz im Gegenteil! Frei nach dem Motto: „Was ich mache, könnte auch anders gemacht werden.“

Auf der Folgeseite Steuerung von Animationen möchte ich diese Bilder-Show dann mit animation.pause(), animation.play() und .reverse() dann steuern.

Ja, das ist eine gute Idee. Dir ist aber schon klar, dass damit auch CSS-Animationen gesteuert werden können? Was in CSS umgesetzt werden kann, sollte nicht mit JavaScript gemacht werden.

Mit besten Grüssen
Richard