2016年更新

Question

我正在使用fullPage.js作为一个寻呼机网站。它工作得很漂亮。它支持滚动滚动滚动整页幻灯片，每张幻灯片还可以包含水平幻灯片，通常通过单击其中一个侧箭头在该点触发。

我想强制用户滚动浏览该幻灯片，然后才能进入下一张幻灯片。有没有人知道在向下滚动时允许用鼠标滚轮触发幻灯片的方法？然后，当它到达幻灯片结束时，它再次垂直滚动到下一张幻灯片？

Answer 1

2016年更新

现在fullPage.js为它提供了Scroll Horizontally extension。

您想要实现的内容并非在插件中实现的那么简单。此外，我想说从用户体验的角度来看，强迫用户遵循路径并不是一种好的做法。

此外，一旦用户到达下一部分然后向上滚动，会发生什么？他是否应该一路追回上一节的幻灯片，以便继续前进？

无论如何，如果你想自己完成它，首先需要避免滚动幻灯片时的自动滚动行为（或者你想要应用它的部分幻灯片）。

然后，您需要通过根据滚动方向触发控制箭头事件来更改滚动行为以触发操作转到下一张幻灯片或上一张幻灯片。

一旦到达滑块的末尾，您甚至需要再次添加自动滚动。

如果你想自己做的话，这听起来并不简单。你需要重新编码插件。

Answer 2

您可以使用jquery.mousewheel执行此操作：

$('#fullpage').on('mousewheel', function(event) {
       if (event.deltaY > 0){$.fn.fullpage.moveSlideRight();}
       else{$.fn.fullpage.moveSlideLeft();}
});

https://github.com/jquery/jquery-mousewheel

使用fullPage.js水平滚动，是否可以使用鼠标滚轮？

2 个答案:

2016年更新