I've been messing around with CSS and Javascript and aside from the fact that the two do not directly translate to each other I can't get CSS doing a translate position on an image in an Inkscape SVG file but it works fine when I use JavaScript, even using matrix transformations doesn't allow for translating the position in CSS, rotation, scale, skew etc.. work fine.
problem solved.
You backtrace from anything that calls animate, that's a lot easier than forward tracing because you basically have a known stack not an unknown one.
in the attached case tracing changeAnimation and doDrag may require runtime analysis unless you trace through document.getElementById I'll have a look at what various javascript engines tracing features provide.
I'm just having a look at css vs js animation and discovered that inkscape isn't loading and saving my script that's in the svg file.
the main difference between css and js is css has limited ability for interactive animation and doesn't support dynamic animation. apart from that CSS seems pretty feature rich.
I'm just writing a dynamic/interactive rubber band animation effect in javascript to check the limitations of css comparatively. I don't think CSS would be able to support things like shape morphing either unless it's all precompiled.