CODEWITHSUNDEEP
javascriptjquery
Sebastian
Sebastian

Reputation: 3626

location.reload() not working after jQuery animations

With this code, none of the animations happen - it skips straight to the location.reload(). However, if I remove location.reload(), the animations work fine.

How can I have both?

$( "#welcome" ).animate({
    opacity: 0,
}, 100, function() {
})
$( "#signup_link" ).animate({
    opacity: 0,
}, 200, function() {
})
$( "#forgotten" ).animate({
    opacity: 0,
}, 200, function() {
})

$('.login-container').animate({ opacity: 0, top: "-100px" }, 'fast').delay(3000);

location.reload();

Upvotes: 2

Views: 148

Answers (1)

james emanon
james emanon

Reputation: 11807

Perhaps something like this: I'm assuming you want the animations and reload to fire as you have them sitting in your original post. jsfiddle: http://jsfiddle.net/Pv4RV/2/

note: I commented out the 'reload' part as that will then just generate a loop on the page.

$.when(
    function(){
            $( "#welcome" ).animate({opacity: 0,}, 100, function() {});
            $( "#signup_link" ).animate({opacity: 0,}, 200, function() {});
            $( "#forgotten" ).animate({opacity: 0,}, 200, function() {});
    }()
).then(
    $('.login-container').animate({ opacity: 0, top: "-100px" }, 'fast').delay(3000)
).then( 
    location.reload() 
)

Upvotes: 1

Related Questions