jquery - animate.css 用于登陆页面上的欢迎效果

Question

发现了这个很酷的东西https://github.com/daneden/animate.css。它在页面启动期间工作，但之后我发现动画 css 仍然在中间触发。

例如， $('.sidebar').addClass('animated fadeInLeft');当我单击页面到页面时，我仍然会使用动画.. 如何限制它只能工作一次？

Answer 1

根据 .css 文件（https://github.com/daneden/animate.css/blob/master/animate.css）动画持续时间为 1 秒。

所以你只需要在 1 秒后从元素中删除类之前的设置。

setTimeout(function(){
   $('.sidebar').removeClass('animated fadeInLeft');
}, 1000);

如果您使用“.hinge”类，那么您需要将“setTimeout”函数的超时时间增加到 2 秒。

Answer 2

效果运行后，请执行以下操作：

$('.sidebar').removeClass('animated fadeInLeft');

Answer 3

如果从一个页面点击到另一个页面会导致您重新加载，请不要包含

$('.sidebar').addClass('animated fadeInLeft');

不需要动画的网站上的脚本。

否则，用于removeClass()删除在您不希望有动画的网站上导致动画的类：

$('.sidebar').removeClass('animated fadeInLeft');