Animation in Frame-Sequenzen zerlegen

[var]

@TS

erzähl doch mal, um was für eine Animation es sich handelt.

• Hast Du die selber erzeugt?

Ja, mit WebGL, also in JavaScript und GLSL geschrieben.

• kannst Du sie in Sequenzen zerschneiden?

Nicht wirklich. Die Programme werden rekursiv mit requestAnimationFrame( ) aufgerufen, das heißt, der Browser bestimmt letztlich die FPS-Rate, und das wäre anders auch nicht zufriedenstellend zu lösen, da feste Vorgaben mit setInterval( ) extrem unperformant sind.

Dazu kommt, dass bei den Animationen unterschieden werden muss zwischen deterministischen und nichtdeterministischen Abläufen. Es kommt nämlich nicht selten vor, dass Zufallselemente eine Rolle spielen, die nicht 1:1 reproduziert werden können, zumal die Möglichkeiten, Daten aus einem laufenden GLSL-Shaderprogramm auszulesen auch nur relativ begrenzt sind.

Dann wäre "Frames" schon ein passendes Stichwort, aber nicht fürs HTML, sondern für die Animation. Dann könntest Du nämlich ersteinmal versuchen, diese Sequenzen mittels JavaScript wieder so zusammenzusetzen, dass man den Schnitt nicht mehr bemerkt.

Wie ich eingangs in einem anderen Post schon sagte, wäre es (zumindest bei deterministischen Programmen) theoretisch möglich, durch entsprechende Parametrisierung einen Bestimmten Zustand für T(x) zu reproduzieren, aber das wäre erstens extrem aufwändig, zweitens nur bei bestimmten Animationen überhaupt möglich, und drittens trotzdem kein Garant für einen nahtlosen Übergang.

Mich würde in diesem Zusammenhang interessieren:
Gibt es einen Trigger für JavaScript, der ausgelöst wird, wenn eine Animation endet?

Dazu fand ich auch etwas:
http://www.sitepoint.com/css3-animation-javascript-event-handlers/

Da hast du die Antwort doch gefunden...

animationstart, animationiteration, animationend

...sind die Events für CSS-Animationen. :-)

Beste Grüße,

var