启动/停止鼠标切换和鼠标输出

Question

当访问者在图片中盘旋时，我正在尝试开始GIF动画，我实际上已经完成了这个部分：

$(document).ready(function() {
  $(".lazy[title='img-static']").hover(function() {
    $(this).attr("src", "https://www.website.com/wp-content/uploads/img-static.png");
  }, function() {
    $(this).attr("src", "https://www.webco.dk/wp-content/uploads/img-animation.gif");
  });
});

它将图像从静态PNG更改为动画GIF，但是当鼠标离开时，我需要它切换回静态。

我还听说我应该有GIF预加载，你会怎么做呢？

谢谢你的帮助。

Answer 1

尝试使用mouseenter()/mouseleave()代替，如下所示：

$(".lazy[title='img-static']").mouseenter(function() {
    $(this).attr("src", "https://www.website.com/wp-content/uploads/img-static.png");
});
$(".lazy[title='img-static']").mouseleave(function() {
    $(this).attr("src", "https://www.webco.dk/wp-content/uploads/img-animation.gif");
});