5 ways to create circular progressBar by using jQuery

5 ways to create circular progressBar by using jQuery

1. jquery.polartimer.js

5 ways to create circular progressBar by using jQuery

Polartimer is a circular timer widget supporting basic options and a callback function. The polartimer plugin requires jQuery and the Raphael SVG library.

This project is also on github.

How to use it

Downlaod

2. jQuery Knob

5 ways to create circular progressBar by using jQuery

Demo and Download

3. CSS3 pie graph timer with jquery

5 ways to create circular progressBar by using jQuery

Note: Changed to em’s so you just change the font-size in the timer class and everything will resize accordingly.

Demo and downlaod

4. circular progressBar by jQuery andCSS3

5 ways to create circular progressBar by using jQuery

 

Demo and downlaod

5. ProgressBar.js

5 ways to create circular progressBar by using jQuery

Beautiful and responsive progress bars with animated SVG paths. Use built-in shapes or create your own paths.

See demo page for examples.

Demo and download

 

5 ways to create circular progressBar by using jQuery
24 votes, 4.58 avg. rating (91% score)
  • GuesPostttt

    Cool!

  • tarun

    nice one

  • Atul Patil

    Is it works in IE?

    • http://freenish.com/ Freenish

      They are working on IE9 and above except the last one.

      • Atul Patil

        Is 3rd one working in IE? i
        In 3rd one how i can fill circle with red color when last 5 seconds remain?

        • http://freenish.com/ Freenish

          You can use this website to test IE compatible: http://netrenderer.com/index.php.

          For detail code issue, please ask the project author.

          Thanks.

          • Atul Patil

            Thanks for website .
            How can I ask code related changes to project author.

          • http://freenish.com/ Freenish

            The first three projects have demo or download links, you can find how to contact project authors from those links.

      • Atul Patil

        Thanks for quick replay

  • Atul Patil

    Is 3rd one working in IE? i
    In 3rd one how i can fill circle with red color when last 5 seconds remain?

    • http://freenish.com/ Freenish

      You can use this website to test IE compatible: http://netrenderer.com/index.php.

      For detail code issue, please ask the project author.

      Thanks so much.

  • Kimmo Brunfeldt

    You could also use ProgressBar.js which does not depend on jQuery https://github.com/kimmobrunfeldt/progressbar.js

    • http://freenish.com/ Freenish

      Thanks so much, Kimmo. I’ve added it to post.