Re: Animating SVG with CSS

Hey TJ

> On Sep 17, 2014, at 3:28 PM, "Tab Atkins Jr." <jackalmage@gmail.com> wrote:
> 
>> On Wed, Sep 17, 2014 at 4:26 AM, Dr. Olaf Hoffmann <Dr.O.Hoffmann@gmx.de> wrote:
>> Hello,
>> 
>> clearly, the CSS draft about animation is not applicable for SVG 1.x.
>> If there is an effect due to a feature of this draft, this is clearly a bug in
>> the related viewer ;o)
>> 
>> However, SVG mentions CSS properties, which apply to SVG,
>> most of them available as attributes as well.
>> Typically one can animate those with declarative animation in SVG -
>> and for this type of animation one can select between animating
>> the attribute or the CSS property.
>> Therefore in SVG 1.x one can animate CSS properties using SVG,
>> but not the other way around.
> 
> All CSS properties can be animated with CSS Animations or Transitions.
> This isn't something controllable by the host language, it's a
> property of CSS.  (They can also be animated by Web Animations, as
> they animate CSS as well.)
But web animation is not widely implemented in --even-- the widely use browsers.
> 
>> In the future (SVG 2 draft), maybe most attributes will have a corresponding
>> properties as well - and if the SVG 2 draft mentions, that CSS animations
>> apply, this might work in the future, at least if viewer do what will be
>> recommended ;o)
>> Hoewever, due to the typical implemetation strategies, this might implicate
>> a lot of more bugs in viewers (suddenly they assume, that SVG 1.x attributes
>> can be properties as well, just because these exist in the SVG 2 draft)
> 
> Yes, many more SVG attributes are migrating into properties, which
> means CSS Animations will work more widely; you'll be able to animate,
> for example, the x/y coordinates of shapes.
> 
> ~TJ

But not until the mayor browsers fully support it.

Until then, might as well go canvas.

E-S4L
N-S4L
J-S4L

Received on Wednesday, 17 September 2014 19:36:50 UTC