

Ask HN: Javascript Animated Icons Becoming Mainstream? - shadowpwner

I've noticed more and more the use of animation of CSS, instead of gif icons. For example, on Google's Chrome OS page (http://www.google.com/chromeos/features.html), mousing over brings pretty animations done (almost) purely by rotating or swapping images.<p>Is it feasible to do this to your own website? Has anyone done it?
======
infinity
I like the example from the Chrome OS page, it looks really cute.
Unfortunately, if JavaScript is deactivated no icons are visible. Some kind of
fallback would have been nice.

I have sometimes experimented with JavaScript based animations in the past.
But most of the time I decided against putting the animations on web pages, if
the page is not about the JavaScript animation itself. Sometimes less really
is much better and less distracting. So I think that animations like in the
example from the Chrome OS page will not become mainstream.

You could also use SVG embedded in XHTML for animations. Fade-in effects and
movements of objects and much more are possible. Unfortunately Inline-SVG does
not work in Internet Explorer: the pages will have to be delivered with an
application/xhtml+xml MIME type to browsers that can understand it (Opera,
Firefox, Chrome, Safari). Internet Explorer will just show a download prompt
for such a page. And the XHTML pages must be valid, otherwise the compliant
browsers display an error page instead of the (buggy) web page. This is a huge
difference to normal HTML pages.

With SVG it is possible to construct vector graphic animations without
JavaScript for browsers that support SVG animations. Additionally, you can use
JavaScript for more complex effects. This is an alternative to animations with
image files and JavaScript. It is also possible to use images in SVG.

