On Thu, Nov 15, 2012 at 11:57 PM, Daniel Friesen <daniel@nadir-seen-fire.com> wrote:
On 12-11-15 8:02 AM, Pau Giner wrote:
The implementation I created was a quick hack to show the animation. As you commented, the ideal solution should be friendly with high resolution displays, support old browsers, and not be js intensive.
According to what I saw on bug 32101 it seems that there is still no consensus on how to better achieve the above requirements.
A loader should generally only ever happen on a page where JS is enabled so deciding how to handle this situation is much easier.
This stuff is made up of simple shapes so vector graphics are the cleanest way to implement this. And since we're in JS we can easily test capabilities and switch to VML when in an SVG-less IE.
And best performance is naturally done through using the best available css.

I wouldn't bother with VML; old IE can get an animated GIF and nobody'll know the difference. :)

I revised my experiment based on that with better sizes, colours, and arcs instead of layered circles.
[snip]
 
For some reason this doesn't animate correctly in Safari or Chrome when I zoom in; the origin of the rotation moves away from the center.
 
-- brion