循環加載條

我使用這個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() {} 
    }); 
});

這裏是代碼

來源

2014-09-29 Darko Trajkovic

不太清楚你的意思是「我怎麼可以添加更多的div」。你能否解釋一下你想要完成的事情？ – Scottie 2014-09-29 21:31:46

這是什麼問題？ – 2014-09-29 21:32:02

你想添加什麼，更多的加載酒吧？或點擊按百分比填充加載欄... – 2014-09-29 21:36:25

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

打開rotator.js文件這個腳本，並且改變代碼作爲below.There是該我固定加入「-random號碼」到畫布元素的id與jquery dublicate帆布IDS 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);

而你可以添加儘可能多的div元素與您的html不同的ID：

<div id="rotator" style="height:300px;width:300px"></div> 
<div id="rotator2" style="height:300px;width:300px"></div>

來源

2014-09-29 21:56:24

正是我一直在努力...唯一的事情是我加入一個計數變量遞增和它，而不是隨機數...我的jsfiddle http://jsfiddle.net/fegvc5h8/ 20/ – 2014-09-29 22:10:33

@Karthik Ganesan發生:)。我也提高了你的評論。我會留下這個案例的隨機解決方案。謝謝 – 2014-09-29 22:30:48

回答

相關問題