Remplacer une image au survol
Bonjour à tous.
Voilà j'tilise depuis un certain le script lazyload qui permet de charcger les image scroll
Code:
1 2 3
| <a href="http://192.168.1.104/a.html" class="product_image">
<img class="img_first lazy" data-original="http://192.168.1.104/image1.jpg"/>
</a> |
Désorais je souhaiterais ajouter une deuxie image qui change au survol.
J'ai donc
Code:
1 2 3
| <a href="http://192.168.1.104/a.html" class="product_image">
<img class="img_first lazy" data-original="http://192.168.1.104/image1.jpg" data-original-b="http://192.168.1.104/image2.jpg"/>
</a> |
Code:
1 2 3 4 5 6 7
| $(".product_image").hover(
function () {
$(this).find('.img_first').attr("src",
$(this).find('.img_first').attr("data-original-b")
);
}
); |
Ce qui fonctionne pour change de l'image1.jpg -> image2.jpg quand je met ma souris dessus, mais quand j'enleve l'image je souhaiterais revenir à la normal (image1.jpg) et là je bloque.
J'ai tenté:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13
| $(".product_image").hover(
function () {
$(this).find('.img_first').attr("src",
$(this).find('.img_first').attr("data-original-b")
);
}
),
function () {
$(this).find('.img_first').attr("src",
$(this).find('.img_first').attr("data-original")
);
}
); |
Merci d'avance