Здравствуйте. У меня есть такая задача - при наведении на блок должна включаться анимация (по сути, должно пересчитать 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();
});