我正在使用这个名为 Simple Circular Loading Bar with Percentage - Rotator 的 jQuery 插件 http://www.jqueryscript.net/rotator/Simple-jQuery-Circular-Loading-Bar-with-Percentage-Rotator.html
如何添加更多的div
这是一个 jsFiddle 示例 - http://jsfiddle.net/fegvc5h8/
$(window).load(function() {
$("#rotator").rotator({
starting: 0,
ending: 100,
percentage: true,
color: 'green',
lineWidth: 7,
timer: 10,
radius: 40,
fontStyle: 'Calibri',
fontSize: '20pt',
fontColor: 'darkblue',
backgroundColor: 'lightgray',
callback: function() {}
});
});
这是代码
最佳答案
是的,这是可能的。 http://jsfiddle.net/csdtesting/en83d3uu/
打开此脚本的 rotator.js
文件并更改代码如下。我通过使用 jquery 将“-random number”添加到 Canvas 元素 ID 来修复重复的 Canvas ID Math.random():
...
var n = Math.random();
this.empty().append("<canvas height ="+this.height() + " width="+this.width()+" id='my-canvas-"+n+"'/ ></canvas>");
var canvas = document.getElementById('my-canvas-'+n);
您可以通过向 html 添加具有不同 id 的 div 元素来添加任意数量的元素:
<div id="rotator" style="height:300px;width:300px"></div>
<div id="rotator2" style="height:300px;width:300px"></div>
关于jquery - 圆形加载条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26109217/