jQuery航路点不工作

jQuery waypoint not working

本文关键字:工作 航路 jQuery      更新时间:2024-07-17

我正在使用animate.css为我的网站添加一些简单的动画。我希望当它到达一个航路点时,一些信息会逐渐消失,但航路点功能似乎根本不起作用。

jQuery

$('.events-wp').waypoint(function(direction) {
       $('.events-wp').addClass('animated fadeIn');
    });

CSS

.events-wp {
    opacity: 0;
}
.events-wp.animated {
    opacity: 1;
}

HTML

<div class="panel-group events-wp" id="accordion">

使用它就可以工作了。无法让fadeIn工作,但我认为我可能会在CSS中做这件事。(我认为是转型还是过渡)。注意,我把动画类名从一个点改成了"-"。我认为这些点混淆了JS。

    var $events = $('.events-wp');
 $events.waypoint(function(direction) {
   $events.addClass('events-wp-animated');
});

这个视频很好https://www.youtube.com/watch?v=5hPVpVtgle4