jQuery: Animate Margins to Auto?

Question

I'm trying to animate an image so that it centers itself. Here's the code I'd like to use:

$('#myImage').animate({'margin-right': 'auto'});

But when I do that, it's ignored and doesn't change the margin.
Is there a way to animate a margin to auto, or otherwise center an image?

Thanks!

Answer 1

As 'auto' isn't a number, jQuery cannot animate it.

If you are okay with taking the image out of the flow of the document, you can set position to absolute or fixed and try:

$('#myImage').animate({'left': '50%', 'margin-left': -$('#myImage').width()/2 });