Ajax Loader
×

Animated Progress Bar

Simple to make CSS Progress bar which you can use it for free. It degrades gracefully in all the CSS3-not-supported browsers including mobile browsers.

The transparency also degrades in Internet Explorer 6 which makes this progress bar cross-browser compatible. The keyframe "progress" at the bottom is where you would place your value for the bar.

If you dont want the animation, just remove the keyframes & animation from the CSS, and change #progress width to the value you want. Take a look at the code below to get an idea of how this little animated progress bar works.

Related:

×

Coding Preferences


HTML

CSS

Javascript

More

×

Your Default Settings - Preferences

×
×
×

Validations

(Errors from your JS or Pre-Processors code)

    HTML
    CSS
    JavaScript

    Animated Progress Bar

    CSSDeck G+