I just see some awesome affect at Advanced 3D Animations and Transitions that can work with IE6+, FF 3+, Safari 3+ and Opera 8+. They use framework that can create VML(or IE CSS Filter) based on browser.
This framework idea quite like to Raphaël—JavaScript Library. But I found some syntax that should be unique style. Because they create some tag that can provide animation affect like the following code.
<animation:group cols="2" rows="1" e:onmousedown="this.animate(1, 0, 'flip');">
<animation:layer left="50" top="50" width="391" height="174">
<div style="background-image: url('images/widget.gif'); background-repeat: no-repeat; width: 391px; height: 174px;"></div>
</animation:layer>
</animation:group>
From the above syntax, all animated object must be located under animation layer. Moreover, you must define some div to contain it. For IE-based browser, I think it can create any animation by using CSS filter. In the other hands, I do not sure that SVG-based browser can create some animation on any object like div or other dom object.
Is it possible to do that or they just use div to contain required data for creating SVG image and animating it.
Thanks,