Animation Code Being Ignored

I'm having a problem with JQuery animations, I've written a basic webpage that has a login box and when clicking login, the following function is executed.

function buttonClick() {    
    $('div.login').animate({bottom: '500px'});
    window.location.href = 'home.html'
}

When the only code in the function is the animation it works fine but as soon as I introduce the window.location.href code is won't execute in time and the page changes before the animation has even started. Any ideas how to delay the execution of the window line?

Thanks!

1 answer

  • answered 2017-11-14 23:53 charlietfl

    Use the complete callback of animate()

    function buttonClick() {    
        $('div.login').animate({bottom: '500px'}, function(){
           // animation has completed here
           window.location.href = 'home.html'
        });    
    }