基本航点使用

我正在尝试使用航点 http://imakewebthings.com/jquery-waypoints/用于延迟加载网页上元素的 jQuery 插件。但是我无法让它工作。

我做了一个非常基本的例子：http://jsfiddle.net/P3XnN/2/ http://jsfiddle.net/P3XnN/2/

根据 Waypoints 文档，我需要做的就是以下内容。

JS:

$('#waypoint').waypoint(function() {
   alert('You have scrolled to my waypoint.');
});

HTML:

<div style="height: 500px">Scroll down</div>
<div id="waypoint">Waypoint</div>

但事情显然没有那么简单。接下来我可以尝试什么？

该插件文档揭示了一个offset option http://imakewebthings.com/jquery-waypoints/#waypoint-options执行以下操作：

确定元素顶部与元素顶部的距离 浏览器窗口触发航路点。它可以是一个数字，即 取为像素数，表示像素百分比的字符串 视口高度，或返回像素数的函数。

您可以将选项传递给waypoint方法作为第二个参数：

$('#waypoint').waypoint(function() {
    alert('You have scrolled to my waypoint.');
}, {
    offset: '100%'
});

这是一个更新小提琴 http://jsfiddle.net/y75sgp0t/。更新了损坏的 CDN 资源 2022。