Question

我正在尝试使用 animate.css 的fadeInUp 函数，但它一直过早地工作。起初我不认为它有效，然后我刷新了页面并且它动画但只有当我点击刷新按钮时。这是代码

 <html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
</head>
<body>
<div class="grid mt-4 claim animate__animated animate__fadeInUp"></div>
</body>
</html>

我还尝试降低动画的速度，结果显示我确实做到了，只是当我点击刷新按钮并且页面正在加载时它仍然有效。所以我想知道的是如何让动画在加载后而不是在加载过程中工作。

Answer 1

覆盖 animation-delay 属性，如：

动画延迟：6s；（这里6s表示6秒后开始动画）

使用 animation-duration 来改变动画的速度 liuke：

动画持续时间：10s；（这里 10s 表示动画将在 10 秒内完成）谢谢。

如何阻止动画过早执行

1 个答案: