CSS Loading Animation for AJAX Requests

By Akbar • August 9th, 2012

Albeit the browser support issues and reason that they are more resource hungry than GIF animations, the CSS animation for the web are getting popular. I’m already using one on my homepage while its loading recent blog posts. If you just google “CSS loading animation”, you should find hundred of results, out of which top 20 or 30 are very relevant, and contains some nice CSS animations.

With this popularity, there comes also the sites which are dedicated to only generating the CSS based animation for any of your choice and color scheme like:
http://cssload.net/

If you want to learn and develop your own, I would recommend the following two starting tutorials:
CSS3 Loading Spinners Without Images
CSS3 Loading Animation Loop

Like here is a simple rotate animation of the Google Chrome:

I’m also working on one of my own CSS loading animation. And guess what’s it’s Rubik’s Cube. I’m still working on it, but here is any early preview of the so far progress:
http://jsfiddle.net/syedgakbar/S3Ppm/2/

Here is the JSFiddle embedded preview:

3D version of the Rubik’s Cube with cool animation is coming soon. So, stay tuned.

Tags: , ,

This entry was posted on Thursday, August 9th, 2012 at 7:36 pm and is filed under HTML & CSS. You can follow any responses to this entry through the RSS 2.0 feed.
You can leave a response, or trackback from your own site.