Waypoints, animate.css и непрозрачность по проблеме прокрутки

Я использую waypoints.js и animate.css для анимации элементов на моей странице при прокрутке вниз. Мне интересно, как включить встроенные свойства непрозрачности в рамки animate.css. В моей скрипке вы можете видеть, как apon входит в экран сверху или снизу, мое изображение будет анимировать, но как я могу заставить его исчезать. обратите внимание на то, как на втором изображении он затухает, но сначала вспыхивает первый взгляд.

Вот мой 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 к вашему img.

licensed under cc by-sa 3.0 with attribution.