Subscribe to RSS Subscribe to Comments

freesoftwhere.org

Animated SVG bleg

Dear Interwebs,

Is this possible?  I’d like to create a mouse-deformable elastic SVG image.  In other words, the user can click anywhere inside the image and drag the mouse around, and in response the object(s) underneath the cursor would be stretched in the direction of mouse movement, as if they were rubber sheets.  The clincher is elasticity — I’d like the distorted objects to animate back to their original shape on mouseUp or loss of focus.

I’ve been reading up on SVG animation docs last night and this morning, but I haven’t found any actual examples that come close to what I’m talking about.  Most of the tutorial sites deal with primitives (and justifiably so, of course), and this concept clearly involves  different stuff … restoring original positions of the nodes, etc.  Got any help?

Thx!

Based on FluidityTheme Redesigned by Kaushal Sheth