我正在玩并试图建立一个视差网站 - 是的,我知道它们是一种烦人的时尚,但我仍然想试一试。 所以,为了获得灵感,我一直在看各种好的视差网站的例子,并遇到了这个: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
试试这个。https://nicescroll.areaaperta.com/
它有
$().scrollTop()
jQuery事件侦听器也是如此,因此您可以使用视差脚本配置滚动路径。
我认为你必须结合其中的几种效果才能制作出类似于路虎网站的东西。平滑滚动脚本、滚动路径脚本和视差脚本。
对于该网站的路径元素,这是一个有趣的网站:http://joelb.me/scrollpath/
尽管了解这些网站如何工作的最佳方法是检查它们!一些使用视差的很酷的网站:http://www.awwwards.com/?s=parallax&post_type=all&search=Ok
我希望这有一些帮助/灵感!