这是我想要的代码。http://p.ar2oor.pl/cprogress/这正是我的项目所需要的。下载文件有一些代码,但没有实现说明。没有jquery xp我不知道如何如何实现它。我使用的html从页面源和链接jquery通过谷歌cdn。这是小提琴。
http://jsfiddle.net/ebenhafkamp/abrdz924/<div class="radial">
<div class="jCProgress" style="opacity: 1;"></div>
<div class="percent" style="display: block;">70</div>
<canvas width="105" height="105">
</div>
它基本上是一个编译的代码从网站,js是纯粹是写在下载链接和css是我从文档中使用的唯一的东西。我看不出它怎么能产生它应该产生的东西。
在此链接包含该文件:http://p.ar2oor.pl/cprogress/jCProgress-1.0.3.js然后按照实现说明的建议执行:
HTML<div id="my-cprogress"></div>
Javascript $('#my-cprogress').cprogress({
percent: 10, // starting position
img1: 'v1.png', // background
img2: 'v2.png', // foreground
speed: 200, // speed (timeout)
PIStep : 0.05, // every step foreground area is bigger about this val
limit: 20, // end value
loop : false, //if true, no matter if limit is set, progressbar will be running
showPercent : true, //show hide percent
onInit: function(){console.log('onInit');},
onProgress: function(p){console.log('onProgress',p);}, //p=current percent
onComplete: function(p){console.log('onComplete',p);}
});
Here's fiddle: http://jsfiddle.net/abrdz924/1/
注意:请记住,您必须提供两个现有的图像作为背景('img1'和'img2')。在本文中,您将看不到它们,因为我指定的uri无效。