CSS3 Animated Progress Bars
Animated CSS3 progress bars created using animation and keyframes properties. It's created by Lee Munroe originally but I implemented the reverse direction on the progress bar. It uses many CSS3 properties, like border-radius, animation, text-shadow, box-shadow, rgba, linear-gradient and keyframes to make the progress bar and it's animation.
The bar is wrapped into a div.bar (this div is to create the outer border of the progress bar by using rgba backgrounds so that it fits perfectly on any type of background) and the span tag inside it is used to show the actual progress bar. The background of the progress bar is created by using repeating gradients as the background of it and then animated using keyframes.
This will look great in Webkit based browsers and Firefox as Opera and IE doesn't support animation and keyframes properties yet. Feel free to look at the code to understand how it's done and use it in your projects.