Помогите разобраться с This
 

Здравствуйте. У меня есть такая задача - при наведении на блок должна включаться анимация (по сути, должно пересчитать 5 картинок подряд).

Я сделал это так: в блок вставил 5 спанов с разными классами и абсолютным позиционированием. Все они спрятаны, но при наведении они по очереди показываются с небольшим интервалом. Получается анимация (код выложу чуть ниже).

Только есть небольшая проблемка, при наведении мыши на элемент, во всех элементах с данным классом начинает меняться фон (что собственно и логично). Как можно сделать так, чтобы фон менялся только у того элемента, на который я навел?

Я думал, это нужно сделать с помощью $(this). Но я могу и ошибаться, так как в ЯС и jquery еще совсем зеленый.

$('.imgWrap').hover(function(){
	$('.image, .image2, .image3, .image4, .image5, .image6').hide();
	$('.image1').show();
	setTimeout(function(){
	$('.image1').hide();
	}, 300);
	setTimeout(function(){
	$('.image2').show();
	}, 300);
	setTimeout(function(){
	$('.image2').hide();
	}, 600);
	setTimeout(function(){
	$('.image3').show();
	}, 600);
	setTimeout(function(){
	$('.image3').hide();
	}, 900);
	setTimeout(function(){
	$('.image4').show();
	}, 900);
	setTimeout(function(){
	$('.image4').hide();
	}, 1200);
	setTimeout(function(){
	$('.image5').show();
	}, 1200);
	

},function(){
	$('.image1, .image2, .image3, .image4, .image5, .image6').hide();
	$('.image').show();
});

:)

рони,
уже так делал, но все ровно при наведении во всех блоках .imgWrap меняются картинки

malevi4,
сделайте минимальный макет хотя бы с двумя блоками

рони,
у меня пока два блока и стоит

Вот так сейчас код выглядит:

$('.imgWrap, this').hover(function(){
	$('.image, .image2, .image3, .image4, .image5, .image6, this').hide();
	$('.image1,this').show();
	setTimeout(function(){
	$('.image1,this').hide();
	}, 300);
	setTimeout(function(){
	$('.image2,this').show();
	}, 300);
	setTimeout(function(){
	$('.image2,this').hide();
	}, 600);
	setTimeout(function(){
	$('.image3,this').show();
	}, 600);
	setTimeout(function(){
	$('.image3,this').hide();
	}, 900);
	setTimeout(function(){
	$('.image4,this').show();
	}, 900);
	setTimeout(function(){
	$('.image4,this').hide();
	}, 1200);
	setTimeout(function(){
	$('.image5,this').show();
	}, 1200);
	

},function(){
	$('.image1, .image2, .image3, .image4, .image5, .image6, this').hide();
	$('.image,this').show();
});

malevi4,
вы неправильно добавили посмотрите на пример во 2 посте

рони,
Все работает. Спасибо большое:)

malevi4,
на всякий случай
http://javascript.ru/forum/jquery/56...animacijj.html