Wackelpudding

[Der Martin]

Moin,

ich versuche mir gerade zusammenzureimen, wie ich eine Idee programmiertechnisch umsetze. Und zwar möchte ich gern ein Bild so animieren, dass es sich beim berühren mit dem Mauszeiger, oder auch nur beim klicken, verhält wie Wackelpudding, der mal kräftig eins mit dem Finger bekommt.

nette Idee ...

Es soll halt am Anfang stark gedehnt werden und dann mit drei oder vier Schwüngen in die Ausgangspositin/Größe zurückkehren.
Gibts da eventuell was vorgefertigtes für/mit jQuery oder kennt jemand ein Javascript was genau das macht?

Also eine gedämpfte Schwingung. Und mit der Auslenkung x(t) modulierst du die width- und/oder height-Eigenschaft des Bildes.

Allerdings wird das visuell noch weit vom Wackelpudding entfernt sein, weil das Bild seine starre rechteckige Form beibehält. Das Typische beim Wackelpudding ist ja, dass die Form eben nicht stabil bleibt, sondern in sich schwankt und wabbelt. Das bekommst du aber mit Javascript nicht hin, weil Javascript nicht die Bilddaten selbst manipulieren kann.
Möglicherweise leistet irgendeine CSS-Transformation oder für den IE ein filter-Effekt etwas Vergleichbares; sonst bleibt nur noch, den Effekt als Bildsequenz vorzurechnen. Entweder als animiertes GIF, oder als Video. Oder Flash, was ja gern für solche Effekte verwendet wird.

Ciao,
 Martin