Question

我的用例是我需要检测用户何时读取页面的20％，40％等。

然而，该库的工作方式似乎不同，因为它检测某个DOM元素何时进入视图，而不管其滚动深度如何。

如何让它做我需要的？

Answer 1

查看文档http://imakewebthings.com/waypoints/api/offset-option/

要检测页面位置，您可以将Waypoint附加到页面的包装器。我的意思是页面的父元素，它将保存页面内容（它将是页面的100％高度）：

<body>
    <div id="wrapper">
          page content...
    </div>
</body>

然后根据文档，您可以使用“偏移”来实现您的需求。您可以将Waypoint附加到“包装器”并使用偏移量来获取百分比以检测用户滚动的距离。

var waypoint = new Waypoint({
    element: document.getElementById('wrapper'),
    handler: function(direction) {
         alert('50% past the top')
    },
    offset: '-50%'
})

使用Waypoints库滚动百分比

1 个答案: