Question

I need to move an object smoothly with jQuery. I am using the .animate() method. I am animating it’s position property. It pretty much works everywhere but the element isn’t animated smoothly in Chrome.

$('#element').animate({
    'left': '+=' + 400 + 'px'
}, 800);

How should it be animated correctly?

Answer 1

Animating the margin seems to do the work. Just use:

$('#login').animate({
    'margin-left': '+='+screen.width*2+'px'
}, 800, function(){ $('#login').addClass('inv'); });
$('#register').animate({
    'margin-left': '-150px'
}, 800);