Question

我有这个：

<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.waypoints.js"></script>

此：

.icon {
  text-decoration: none;
  border-bottom: none;
  position: relative; /*puede ser acá */
  opacity: 0.5;
}

另一件事：

.icon-animate {
    opacity: 1;
}

最后这个：

var $first = $('.icon');

$first.waypoint(function (){
    $first.addClass('icon-animate');
});

文件名称正确，属于正确的文件夹。为什么它不起作用？

Answer 1

使用waypoint编写函数的正确方法如下：

$first.waypoint(function(direction) {
    $first.addClass('icon-animate');
});

然后，您可以指定选项：

// hit the top of your element when scrolling up
$first.waypoint(function(direction) {
    if (direction == 'up') { // hit the top of your element when scrolling up
        $first.addClass('icon-animate');
    }
});

// hit the top of your element when scrolling down
$first.waypoint(function(direction) {
    if (direction == 'down') { // hit the top of your element when scrolling down
        $first.addClass('icon-animate');
    }
});

// hit the bottom of your element when scrolling up
$first.waypoint(function(direction) {
    if (direction == 'up') { 
        $first.addClass('icon-animate');
    }
}, { offset: function() { return ((-$(this).height() + $("body").height())) } });

// hit the bottom of your element when scrolling down
$first.waypoint(function(direction) {
    if (direction == 'down') { 
        $first.addClass('icon-animate');
    }
}, { offset: function() { return ((-$(this).height() + $("body").height())) } });

Answer 2

请删除其中一个航路点js文件。它不能包括两者。

<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.waypoints.js"></script>

为什么jQuery waypoints不起作用？

2 个答案: