Показать сообщение отдельно
  #1 (permalink)  
Старый 07.06.2015, 20:25
Интересующийся
Отправить личное сообщение для malevi4 Посмотреть профиль Найти все сообщения от malevi4
 
Регистрация: 23.05.2015
Сообщений: 11

Помогите разобраться с 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();
});
Ответить с цитированием