滚动问题上的航点,animate.css和不透明度

时间:2014-08-22 01:32:26

标签: javascript jquery css html5 animation

我正在使用waypoints.js和animate.css在向下滚动时为我页面上的元素设置动画。我想知道如何在animate.css框架中包含内置的不透明度属性。在我的小提琴中你可以看到我的图像从顶部或底部进入屏幕的动态是如何动画的,但我怎么能让它淡入。请注意第二张图像如何消失,但闪现第一种看起来有点毛病。

这是我的javascript:

//Animate from top
$('.animated').waypoint(function() {
$(this).toggleClass($(this).data('animated'));
},
{ offset: 'bottom-in-view' });
//Animate from bottom
$('.animated').waypoint(function() {
$(this).toggleClass($(this).data('animated'));
});

http://jsfiddle.net/3qy0hs3L/1/

1 个答案:

答案 0 :(得分:1)

所有需要做的就是在你的img中添加不透明度:0。