Débora
Débora

Reputation: 5952

JQuery animation fails

An animation for a loading message is done by JQuery. When the page is about to be redirected to another page, the loading message is displayed. Here what the animation does is, increase the width of a DIV element.
$('#loading').css({"width:":value});

Above,'value' is increased through setInnterval(), My problem is, when the page is going to redirect to the other page(some time for 4 ,5 seconds) the animation doesn't happen. Any one let me know why this happen and how this can be avoided ?

Upvotes: 0

Views: 121

Answers (2)

jiguang
jiguang

Reputation: 362

You need show more detail of your code, basicly redirect may happens before the animation, you may watch the value, then when the value up to the maximum, do the redirect.

var value = 0;
var timer = setInterval(function(){
    if(value >= someValue){
        clearInterval(timer);
        location.href = 'someURL';
    }else{
        $('#loading').css('width', value++);
    }
});

haven't test yet.

Upvotes: 0

Darko
Darko

Reputation: 38910

why not just use the inbuilt jQuery animate instead of your own setInterval?

$('#loading').animate({ width: finalValue });

you just need to tell it what you want the final width to be.

Upvotes: 1

Related Questions