[greatilya]

Добрый день!

Приведу пример сложности с которой столкнулся:

<a href="/"><img src="i.jpg" onload="EffectHoverImageParent(this)" /></a>

Стили:

a {width:60px;height:90px;display:block;float:left;margin:0;overflow:hidden;text-decoration:none;}
a img{position:relative;}

Скрипт ниже, делает так, чтобы при наведении на ссылку изображение уменьшается, чтобы вписаться в рамку 60х90. А когда убираем курсор со ссылки то изображение возвращается в исходное состояние (100% размер и отцентровано в блоке, что не влазит, то скрывается). Получается некий эффект зумма при наведении. Вот собственно сам скрипт (не рекомендую особо вникать в этот сумбур кода, т.к. соль вопроса не в этом):

function EffectHoverImageParent(el) {
	var iW=$(el).width();
	var iH=$(el).height();
	var iWp=$(el).parent().width();
	var iHp=$(el).parent().height();
	var iL=(iWp-iW)/2;
	var iT=(iHp-iH)/2;
	var iHh=iHp; var iWh=iHh*iW/iH; var sP='height';
	if(iWh<iWp) { iWh=iWp; iHh=iWh*iH/iW; sP='width'; }
	var iLh=(iWp-iWh)/2;
	var iTh=(iHp-iHh)/2;
	$(el).css('left',iL+'px').css('top',iT+'px').css('opacity','0.8');
	if(sP='height') {
		var oP={'opacity':'0.8','height':iH+'px','top':iT+'px','left':iL+'px'};
		var oPh={'opacity':'1.0','height':iHh+'px','top':iTh+'px','left':iLh+'px'};
	}
	else {
		var oP={'opacity':'0.8','width':iW+'px','top':iT+'px','left':iL+'px'};
		var oPh={'opacity':'1.0','width':iWh+'px','top':iTh+'px','left':iLh+'px'};
	}
	
	$(el).hover(
		function(){
			var $this = $(this);
			$this.stop().animate(oPh,150);
		},
		function(){
			var $this = $(this);
			$this.stop().animate(oP,150);
		}
	);
}

Сайт который использует данный скрипт построен на AJAX и страницы подгружаются динамически. И чем больше таких картинок отобразилось на экране, тем больше начинает тормозить браузер. Следовательно скрипт написан далеко не профессионально. Значит мне нужно понять свои ошибки и научиться писать правильно.
Теория о том, где ошибка
Думаю я неэффективно использую память ПК. На все подгруженные картинки навешивается свойство $(el).hover(...,...);, которое видимо хранится в оперативе и т.п. Видимо когда таких картинок пару сотен, то оператива не слабо заполняется, отсюда идут глюки... Нужно отказаться от hover и использовать стандартные способы навешивания функций на события?
Подскажите, в ту сторону ли я копаю, или я допустил совершенно другие ошибки? Может быть есть некий принцип написания кода, так сказать некий образец, чтобы не допускать утечек памяти ... ткните носом, что мне нужно подучить ...

Спасибо!