Search code examples
javascripttimercountdown

Countdown timer to Countup


Hello guys i have this countdown script but i want it to countup and instead of updating a div span, update the value of a progress bar.

HTML

<progress value="**UPDATE THIS**" max="780"></progress>

SCRIPT

var sec = $('#update span').text(), secInit = sec;
        var timer = setInterval(function() {
            $('#update span').text(--sec);
            if (sec == 0) {
                sec = secInit;
                $.ajax({
                    url: "{{ url('/user/update') }}",
                    type: "GET",
                    data: { 'id' : {{ Auth::user()->id }} }
                });
            }
        }, 1000);

Any idea?

Thanks, Tiago


Solution

  • Give the progress bar an ID such as

    <progress id="progress-bar" value="**UPDATE THIS**" max="780"></progress>
    

    and use some javascript to change the value each second, eg.

    var timer = setInterval(function() {
                var progbar = document.getElementById("progress-bar");
                progbar.value = progbar.value < 780 ? +progbar.value + 1 : 0;
            }, 1000);
    

    Fiddle