13 June 2010

A Effect based SVG animation API

I am experimenting a new API for SVG animation. The approach is different, I am creating a API for a normal user who can understand in terms of "Effects" like fadein, fadeout,  flyin, flyout.
Here is the Syntax to code animation. I have just started, so I have added only two effect, flyin and changeFillColor.

Remember , Demo Only work in Opera browser, as It support Animation tags
Demo  --
Feedback Welcome

var player = new SvgArea("test" , {"height":800 , "width":400});

player.add("circle" , {
    'r': 50,
    'fill': "#0FF",
    'stroke': "#00F",
'stroke-width': 2,
    'cx': 100,
    'id': "mycircle",
    'cy': 100

player.Animate("mytext", "flyin",{

player.Animate("mycircle", "flyin",{

player.Animate("myrect", "flyin",{

player.Animate("myrect", "changeFillColor",{
     'fill':"black",//RBG value

Post a Comment