javascript - 悬停在按钮/元素上时如何使它们具有动画效果？

<分区>

关闭 6 年前。

我有一个我正在想的例子，但我无法真正描述它，我希望人们不会介意我直接链接到商业网站，但无论如何:

靠近底部有一个包含 6 个 div 元素的片段，当您将鼠标悬停在每个元素上时，它们以类似的方式进行动画处理。

起初我怀疑 onmouseenter 静止的背景图像被 GIF 替换，但后来我意识到 onmouseleave 以某种方式从发生 onmouseleave 时动画完成的点“反转”动画。

我很想从技术 Angular 了解某人是如何做到这一点的，我不需要任何细节或示例。我只是想不出过去的 GIF。

最佳答案

处理动画最干净的方法是使用纯 CSS，这样您就不会因为不必要的样式逻辑而使 Javascript 代码陷入困境。根据我的经验，如果您可以在 CSS 中处理这些事情，那通常是最好的解决方案。

Here's an example了解如何实现您要实现的基本效果。

这里要注意的关键元素是变换和过渡。无需 JS。

关于javascript - 悬停在按钮/元素上时如何使它们具有动画效果？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39195050/

相关文章：

javascript - jQuery every 附加元素