如何使用rotator.js触发jquery加载器

Question

我正在使用这个带有百分比旋转器http://www.jqueryscript.net/rotator/Simple-jQuery-Circular-Loading-Bar-with-Percentage-Rotator.html的名为Simple jQuery循环加载条的插件

这个插件使用canvas标签来绘制圆圈，这个圆圈是在调用jquery函数时绘制的。如何才能在html页面上显示圆，并且只在jquery中调用百分比加载栏时才触发它。

下面是一个jsFiddle示例-- http://jsfiddle.net/fegvc5h8/

下面是代码

<!--html-->
<div id="rotator" style="height:100px;width:100px"></div>

//jquery
$(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

<div id="rotator" style="height:100px;width:100px"></div>
<input type="button" value="Fire" id="Fire">



$('#Fire').click(function () {
       Go();
});
function Go(){
 $("#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/fegvc5h8/5/

Answer 2

我想你想要这样的东西

$('#sub').on('click', function () {
    val = $('#value').val()
    $("#rotator").rotator({
        ending: val
    })
})