使用鼠标滚轮和滚动条平滑垂直页面滚动

Question

我正在玩并试图建立一个视差网站 - 是的，我知道他们是一个讨厌的时尚，但我仍然想要去。所以，为了获得灵感，我一直在研究好的视差网站的各种例子，并且遇到了这个：https://victoriabeckham.landrover.com/INT。

使用鼠标滚轮，滚动条和锚链接进行平滑滚动。我一直在寻找能够实现这种效果的jQuery插件，但似乎只能找到那些使用内部页面链接的插件 - 锚点或ID（详见下文） - 但不是鼠标滚轮和滚动条。我很有可能使用错误的关键字进行搜索。有没有人知道找到这些插件的正确术语或知道任何可以达到这种效果的插件？

另一方面，我目前正在学习jQuery和Javascript，但我还处于早期阶段 - 仍在通过codeacademy进行拖网，而不是在任何现实世界的代码上。所以目前我正在使用插件作为一种学习方式，但希望在几个月内我可以构建自己的东西！

平滑滚动以锚定标签或ID：

• http://archive.plugins.jquery.com/project/ScrollTo
• http://jsfiddle.net/9Amdx/7/
• http://arthurclemens.github.com/jquery-page-scroll-plugin/
• http://www.learningjquery.com/2007/09/animated-scrolling-with-jquery-12
• http://www.designova.net/scrollerbird/
• http://chris-spittles.co.uk/?p=462
• http://joelb.me/scrollpath/（* @DrunkRocketeer提供）

另一个使用类似技术进行滚动的视差网站示例：

• http://www.ascensionlatorre.com

Answer 1

试试这个。 https://nicescroll.areaaperta.com/

已经

$().scrollTop() 

jQuery事件监听器也是如此，你可以使用视差脚本配置滚动路径。

Answer 2

我认为你必须结合其中几种效果才能制作出类似于Landrover网站的东西。平滑滚动脚本，滚动路径脚本和视差脚本。

这是该网站路径元素的一个有趣网站： http://joelb.me/scrollpath/

虽然找出这些网站如何运作的最佳方法是检查它们！一些使用视差的酷网站： http://www.awwwards.com/?s=parallax&post_type=all&search=Ok

我希望这有一些帮助/灵感！