Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Fala povo,
Tenho o seguinte caso:
<img class="hover-change" src="/site/img/content/home/icone-cafe-da-manha.png" data-hover="/site/img/content/home/icone-cafe-da-manha-hover.png" />
Ao passar o mouse na imagem, quero trocar pela imagem que está em data-hover. Até aí, consigo, mas não estou conseguindo retornar a imagem original.
$(".hover-change").hover(function()
{
var imgOriginal = $(this).attr('src');
var imgTroca = $(this).attr('data-hover')
$(this).attr('src',imgTroca);
},
function() $(this).attr('src',imgOriginal);
});
Até entendo que o que tentei não funcionaria pelo fato de imgOriginal estar dentro da primeira função, e não da segunda... mas como posso fazer para que funcione? Não posso deixar a variavel fora, pois existem vários "hover-change" pela página e se eu deixar fora, vai só pegar o último.
Resolvido.
$(".hover-change").hover(function()
{
var imgOriginal = $(this).attr('src');
var imgTroca = $(this).attr('data-hover')
$(this).attr('src',imgTroca);
$(this).attr('data-hover',imgOriginal);
},
function() var imgOriginal = $(this).attr('data-hover');
var imgTroca = $(this).attr('src')
$(this).attr('src',imgOriginal);
$(this).attr('data-hover',imgTroca);
});Carregando comentários...