Daniel
Daniel

Reputation: 1466

How to work with animate JQuery

i'm creating progress bar and i'm animating it to 80% . i want when it reaches 80% , it stays for 3 to 4 seconds and then animate to 0% .

Fiddle : https://jsfiddle.net/r6zj42u3/1/

My JS

var progessss = $('#progressBar');
var counterProgressBar = 1;

for(var x = 0; x <= 1; x++){

    if(counterProgressBar === 1)
    {
        progessss.animate({
            'width':'+=80%'
        },1000);

    }

    counterProgressBar++;
}

i was trying

var progessss = $('#progressBar');
var counterProgressBar = 1;

for(var x = 0; x <= 1; x++){

    if(counterProgressBar === 1)
    {
        progessss.animate({
            'width':'+=80%'
        },1000);

    }
    else
    {
        progessss.animate({
          'width':'0%'
        },1000);
    }

    counterProgressBar++;
}

Upvotes: 1

Views: 44

Answers (2)

Cerlin
Cerlin

Reputation: 6722

how about this one

var progessss = $('#progressBar');
progessss.animate({
    'width':'+=80%'
},1000);

setTimeout(function(){
    progessss.animate({
        'width':'0%'
    },1000);
},5000)

Upvotes: 1

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

You can use setTimeout for this

setTimeout(function(){ progessss.animate({
    'width':'0%'
},1000); }, 4000);

Fiddle

Upvotes: 2

Related Questions