jQuery анимирует ширину от центрированных x координат элемента

Question

Возможно ли animate() ширина элемента, делающего плавную центральную анимацию?

Я имею в виду, что animate заставляет элемент фиксироваться на себе, центрируясь на x координатах?

если я сделаю:

<a class="animate">hey</a>
$('.animate').animate({'width':'+=1%'},500);

это работает, но элемент анимирован справа, а не от его центра

Answer 1

Да, вам также придется переместить элемент.

<a class="animate" style="display:block; width:300px; border:1px solid #000; position:fixed; top:50px; left:50px;">hey</a>
jQuery(".animate").animate({'width':'0px', 'left':'200px'});

http://jsfiddle.net/7Ysbg/

Новая информация

Итак, вы имеете в виду что-то вроде этого: http://jsfiddle.net/7Ysbg/2/

jQuery(".animate").click( function(){
    var w = jQuery(".animate").width();
    var new_w = jQuery(".animate").width()*1.5;
    var left = jQuery(".animate").offset().left - ((new_w - w)/2);
    jQuery(".animate").animate({'width':new_w+'px', 'left':left+'px'}, 'fast');
});

Answer 2

Просто анимируйте не только ширину, но и положение элемента. Например, вы можете анимировать свойство left. В этом случае у вашего элемента должно быть position, установленное на relative или absolute.

var width = $('.animate').width();
$('.animate').animate({
    width: width*1.01,
    left: width*0.005
},500);