Tag: animate.css

如何在加载时隐藏动画元素？

我在着陆页中使用带有waypoints.js的 animate.css 。 我想在用户滚动页面时为元素设置动画。 但是，问题是我需要在动画开始之前隐藏元素（如果我不隐藏，animate.css首先隐藏元素然后动画，看起来非常难看）。 但是，我通过在我的CSS中添加两个类来解决问题，但它产生了另一个问题。 .visible{ opacity: 1; } .invisible {opacity: 0; } // I added following jquery code $(‘elem’).removeClass(‘invisible’).addClass(‘visible fadeInUp’); 这在我向元素添加animation-delay之前一直有效。 这是我想要实现的解释。 我有这样的元素： element1 element2 element3 我想为每个元素添加动画延迟，以便它们使用animation-delay属性在每个元素中以指定的秒数相互fadeInUp 。 我不能让这个工作。 我尝试使用代码而不使用动画延迟但没有成功。 $(‘elem’).each(function() { // code with delay using timeout setTimeout(function(){ $(this).removeClass(‘invisible’).addClass(‘…’); }, 100); }); 如果我的方法完全错误，请告诉我？ 如果是，那么你可以提供更好的方法来完成。

Animate.css不适用于第二次点击

如果我第一次点击.img-1或.img-2就可以了。 bt不是第二次没有页面刷新。 我正在使用Animate.css（zoomIn）。 这是代码示例 – HTML： × jQuery的： $(‘.img-1,.img-2’).click(function(){ $(‘.back-end,.front-end,.dismiss’).addClass(‘animated zoomIn’).show(); }) $(‘.dismiss’).click(function(){ $(‘.back-end,.front-end,.dismiss’).addClass(‘animated zoomOut’); })