有没有办法阻止我的CSS关键帧动画在该元素滚动到视图之前开始?

问题描述

我已经使用关键帧为页面上某些元素的动画设置了动画,但是这些元素位于页面底部,因此动画会在您看到它们之前发生。

是否有一种方法可以阻止动画发生,直到用户滚动到元素视图为止?最好不要使用jQuery解决方案,因为我对此并不熟悉。

注意:我知道有一个名为wow.js的库可以解决此问题,但是它使用animate.css作为动画。这对我来说是个问题,因为我最初使用的是animate.css,但是它与我拥有的其他CSS覆盖/冲突。这就是为什么我切换到动画使用关键帧的原因,为了使元素的所有属性正常工作,我相信我必须保留关键帧而不是animate.css

解决方法

我找到了自己的答案! Wow.js仍然有效,因为您不必使用animate.css动画,您仍然可以使用自己的自定义动画。