Question

我正在使用这个名为简单循环加载栏的jQuery插件，其百分比为 - Rotator 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() {}
  });
});

这是代码

Answer 1

是的，这是可能的。 http://jsfiddle.net/csdtesting/en83d3uu/

打开此脚本的rotator.js文件并更改下面的代码。有一些dublicate canvas id我通过在jquery 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>

圆形装载栏

1 个答案: