[Synov_son]

Доброго времени суток. Ребята помогите пожалуйста. Написал скрипт для сайта с продуктом. В чем его суть. Продукт задал фоновой картинкой блока а в блоке по кругу движутся всякие возможные ингредиенты к этому продукту. Ну в общем:
-php выстраивает мой круг из продуктов по такой логике. Блоку квадратный 400х400 пикселей, он берет центр блока за точку 0(200;200) -начало координат. Ну и я беру радиус круга(r) за 200 и элементам даю стиль left и top, x и y соответственно. Таким образом у меня

x=r+r*cosA - el_width; y=r-r*sinA - el_height

, где A - такой угол что A=0; A0=2*pi/(кол-во элементов) и при каждом новом элементе я A увеличиваю на A0.
Так я построил свой круг из элементов.

$this->csize = 400;//Размер квадратного блока с кругом внутри
		$this->iwidth = 60;//Ширина картинок с папки images/flavors
		$this->iheight = 42;//Высота картинок с папки images/flavors
		$this->images = glob('images/flavors/*.png');
		$a = 2*M_PI/(count($this->images));//шаг круга
		$a0 = M_PI*1.5;//градус начала отсчета
		$r = $this->csize/2;
		foreach($this->images as $key=>$value){
			$this->images[$key] = str_replace(array('images/flavors/','.png'), '', $value);
			$this->top[$key]= ( $r*(1 - sin($a0)) ) + ($this->iheight/2);//от центра квадратного блока берем отсчет
			$this->left[$key]= ( $r*(1 + cos($a0)) ) + ($this->iwidth/2.6);//и смещаем елементы по кругу
			$a0 += $a;
		}
<?php foreach ($this->images as $key=>$value){?>
				<img id="<?=$key?>" src="<?=BASE?>images/flavors/<?=$value?>.png" alt="<?=$value?>" width="<?=$this->iwidth?>" height="<?=$this->iheight?>" style="top:<?=$this->top[$key]?>px;left:<?=$this->left[$key]?>px">
			<?php }?>

-ну а дальше вне нужно сделать так что бы круг вращался с анимацией. Сначала я сделал так:

var css = $('#next').css(['top','left']);
$('current').animate({'top':css['top'],'left':css['left']}),slow);

То есть я брал координаты следующего элемента и перемещал в их предыдущий, но это оказалось неправильным вариантом. Так как js брал координаты следующего элемента до того как тот окончательно закончил движение и получался маленький круг.
По этому я повторил тоже что и было в php коде, только за угол начального отсчета я брал угол на котором лежит нулевой элемент.

function rotate(){
	var images = $('#menu img').length;
	var a = 2*Math.PI/images;
	var r = $('#menu').height()/2;
	var iheight = $('#menu img').height();
	var iwidth = $('#menu img').width();
	var y0 = +$('#menu #0').css('top').replace( 'px', '');
	var y = y0 - iheight/2;
	var a0 = Math.asin( 1 - y/r );
	for(var i=0;i<images;i++){
		a0 += a;
		itop = ( r*(1 - Math.sin(a0)) ) + (iheight/2);
		ileft = ( r*(1 + Math.cos(a0)) ) + (iwidth/2.6);
		$('#menu #'+i).animate({'top':itop,'left':ileft}, 1200, 'easeOutQuart');
	}
}

Проблема в том что нулевой элемент (при каком бы первичном положении он не был A=0 или A=-p/2 или A=p/2) далее угла pi/2 не перемещается. А если я ставлю его изначально на угол pi/2 он перемещается на один шаг вперед и на один назад (циклично).
Подскажите, пожалуйста, в чем проблема, если смогли понять о чем я (писал на быструю руку). Благодарю.