jquery - 有人知道这种悬停动画效果是如何创建的吗？

Question

嗨，我最近看到这种类型的动画使用了很多。我一直在尝试研究如何实现这一点并找到诸如 spritely 之类的插件，但只是想知道我是否遗漏了一些东西，或者是否有更好的方法来实现这种效果。

这是我正在谈论的那种动画的示例：

http://byassociationonly.com/about/

（橙色圆圈中的图标动画）

任何提示或建议都会很棒。

Answer 1

他们使用 css 来更改背景图像。当您将 div 悬停时，背景会切换为动画 gif

Answer 2

我查看了网站的源代码，他们是如何通过 CSS 使用 ":hover" 的。也可以使用 javascript，但我觉得使用 CSS 会容易得多。

CSS 代码示例：

#divName{
 background: url(linkToImage);
 background-repeat: no-repeat;
}
#divName:hover{
 background: url(linkToGIF);
 background-repeat: no-repeat;
}