This page provides pointers to a variety of demos I have put together over the past few years. This includes a bunch of HTML+TIME (i.e. XHTML+SMIL) demos and some SVG animation demos.

I have more demos related to XSLT generation of SMIL and SVG, that I need to put up, but have yet to gather and publish.

XHTML+SMIL demos

Remember: most of these demos need an XHTML+SMIL capable browser, like IE 5.5 or later. I recommend that you use the latest version (IE6 when I wrote this). 

• This page has my working demos that show some ideas with control, including the VCR control of animations.
• Here are the demos that go with the paper "The SMIL 2.0 Timing and Synchronization Model: Using Time in Documents" [MSR-TR-2001-01].
• A nice demo from W3C UK (note the ugly text transitions - animateColor would be smoother, so see the next demo for a fix).
• This page shows how transitions combined with text can look bad, and how they can look good.
• Three demos show how to do timed hyperlinks in which the links are only sensitive to clicks when they are active. The first demonstrates a timed image map, the second shows simple <a> elements with timing, and the third shows <a> elements that also disappear when they are not active.
• A set of advertising demos and a product-sales presentation demo done by real artists (not me). These are still in the syntax of the HTML+TIME submission, and should be updated to XHTML+SMIL syntax.

There are also demos embedded in some of my presentations. Several of the more recent talks are generated using XSLT - if you just view the source, you can see the original xml. If you have the IE XML tools installed, you can then right click and view the XSLT output.

SVG Animation demos

For the demos in SVG, you will additionally/alternatively need an SVG browser, like the ones from Adobe or Apache (Squiggle/Batik).

• This simple demo is intended to show why you want to avoid scaling and rotating text, or if you must, to make the scale and rotation animations run quickly.