jQuery Circular Progress Bar

Add-ons

2026-07-26 00:58 4 次浏览 • 0 次下载 21.9KB

Plugin description: A jQuery Canvas circular progress bar. The progress bar can be quickly customized through parameters.

Parameter Description

 runCircle({
     obj: 'canvasThree',
     percent: 0.5,
     url: 'images/zstart.png', // Small airplane image URL
     imgWidth: 30,// Image width
     imgHeight: 30,// Image height
     circleBottomColor: "#e6eaed", // Background color of the circular ring
     outerColorStart: '#ebf7ff', // Outer ring gradient color
     outerColorMid: '#d8eefc',
     outerColorEnd: '#a7cee7',
     innerColorStart: '#6fbef0', // Inner ring gradient color
     innerColorEnd: '#058ee4',
 });

If you want tochange the overall size of the circular progress bar, you can modify the width of the outer div.

.surePass {
    margin-top:2em;
    position:relative;
    width:50%;/* Modify here */
    float:left;
}