animating svg with css

Hi folks,

 

In the thread at
http://lists.w3.org/Archives/Public/www-svg/2014Feb/0075.html

 

I had asked " Is it possible to use CSS3 to animate the change of either the
src 

of an <img> (HTML) or the xlink:href of an <image> (SVG)?"

 

The sixty or so examples at
http://cs.sru.edu/~ddailey/fading/slides/transitions.html do it using SMIL
to keep the animations synchronized with the image transitions, despite this
not working in IE. (I have yet to try FakeSMILe though it doesn't survive
<replicate> from previous experiments.)

 

fantasai, copied here, has worked closely with members of the SVG Working
Group, as I understand it, to help bring some of the cool things that SVG
does, into the comparatively drab world of HTML. She answers, "no" to the
above question, though alludes to some conditions under which that might be
possible.

 

Generally, when I animate things, I want to animate each of a bunch of
things slightly differently, as in 

http://cs.sru.edu/~ddailey/svg/randF0.svg  (37 lines of markup). For this,
<replicate>,<random> and SMIL seem to be far preferable to CSS since the CSS
sheet would be thousands of lines long to do it!

 

But I got to wondering if I might be able to have each of a couple hundred
small objects wiggle around in place such as at 

http://cs.sru.edu/~ddailey/svg/Stats3.svg   (43  lines of markup) using CSS.
This example uses SMIL and each of the 200 ovals has both an <animate> and
an <animateTransform> inside it -hence requiring 600 DOM objects. (It works
fine in Opera (old) and Chrome, though it is a bit sluggish in FF.)

 

So the questions:

 

Can one use CSS to animate SVG attributes like cx and x and rx and width
(which refer to the geometry of things)? I got the idea somewhere that CSS
was only going to be used for "styling" (and hence animating?) the
presentation attributes  (like in
http://www.w3.org/TR/SVG11/attindex.html#PresentationAttributes )of SVG.

 

Would it be worth rewriting the replicateModifier parts of <replicate> so
that it could find the style associated with a replicated item (like with
filters, patterns and gradients and so forth) and individually clone and
modify the style sheet associated with random elements so that they could
each inherit a unique behavior? If CSS won't be doing "real" SVG attributes,
then it is certainly not worth our time, but it also means, I guess, that IE
will never support declarative SVG animation in any form. Is that a safe
conclusion? If so, then it looks like an update of FakeSMILe will be in
order or else just a million "not for IE disclaimers"?