使用CSS Jquery的垂直滚动条

Question

我正在尝试创建一个垂直滚动条，如this site。

所示

有人可以指导我如何做到这一点吗？任何示例代码都会有所帮助。

先谢谢。

Answer 1

您可以查看其中一些滚动库，以便从页面中获得很好的效果：

• http://scrollmagic.io/
• https://scrollrevealjs.org/
• https://michalsnik.github.io/aos/

对于垂直导航：

• https://codyhouse.co/gem/vertical-fixed-navigation/

• https://codepen.io/janmez/pen/gryoKG

  Vertical Navigation Scroll Effect
  

• http://www.thepetedesign.com/demos/onepage_scroll_demo.html

Answer 2

首先，您的示例并非完全是滚动条。它具有滚动条所具有的一些行为，但您无法使用它进行导航，并且它不会替换默认滚动条，至少不会替换代码。

目前，只有Webkit浏览器（Chrome，Safari，其他）can have their scrollbar styled和IE可以部分设置样式。

你的那个例子是从头开始制作的＃34;通过使用JavaScript使HTML元素表现得像滚动条。

Jquery custom scrollbar是一个Jquery插件，可以帮助您创建自定义滚动条，但可能没有提供足够的功能来制作这样一个复杂的滚动条，如您给出的示例所示。