We're using something similar to this in our current project. We have a fallback to a classic animated gif if animations aren't supported. I'd guess we're not the only people doing this. Wrote it up here: http://icanmakethiswork.blogspot.co.uk/2013/04/a-navigation-...

GIFs don’t do alpha. I’d probably use an SVG though for this.

I would. Certainly prefer CSS stuff compared to GIFs for this kind of stuff.

You might have more luck getting this to work than animating SVG files; which doesn't work in any IE version, and has issues in Safari and iOS Safari, and old versions of Android (Pre 3.0, but damn, they are everywhere).

I agree, it's really nice but it isn't even working in ie9. A .gif would fit the bill in the cross browser department

SVG animation can be chanky on a mobile device

indeed, here is a non-that-fancy loading indicator in SVG:

http://rendro.github.io/SVG-Spinner/

I too would use this.