计时器进度栏

Question

In my php application I get the numbers of seconds that remains to an event: ex: 6000sec. and the total time since the creation of the event until the end. Ex: 10000sec. I want to do a progress bar that take the seconds and, every second, atualize the progress bar.

Basically, I tried with progressbar(), setInterval() But i need help to do this.

$(function() {
var initial = 6000 // need to add seconds to this value every second.
$( "#progressbar" ).progressbar({
  value: initial,
  max: 10000
});

});

FIDDLE

Answer 1

Try this and adjust the values to what you want:

$(function () {
    var current;
    var max = 10000;
    var initial = 6000; 
    $("#progressbar").progressbar({
        value: initial,
        max: max
    });

    function update() {
        current = initial; //the value on each function call
        $("#progressbar").progressbar({
            value: current
        });
        if (current >= max) clearInterval(interval);
        initial += 1000; //choose how fast to the number will grow
        console.log(current);
    };
    var interval = setInterval(update, 1000); //choose how fast to update
});

Demo here