smooth-scrollbar|一款功能强大的JavaScript平滑滚动插件

Smooth Scrollbar是一款功能强大的JavaScript平滑滚动插件，提供了可自定义的、插件化的和高性能的滚动条，并在现代浏览器上使用translate3d实现了基于动量的滚动效果（惯性滚动）。

Smooth Scrollbar可以定制多种样式，包括滚动条的颜色、宽度、高度和形状，同时还可以控制滚动条的可见性以及滚动动画的速度等。此外，Smooth Scrollbar还支持自定义插件，可以为滚动条添加额外的功能，例如鼠标滚轮控制滚动速度、滚动条拖拽和滚动条点击跳转等等。

总之，Smooth Scrollbar是一款功能强大的JavaScript插件，提供了可自定义的、插件化的和高性能的滚动条，能够满足用户的各种滚动条需求。

使用方法

使用

可以通过在项目中运行来开始使用Smooth Scrollbar，也可以通过使用像webpack或rollup等打包工具来将其作为ES6模块导入。

在需要使用的组件中，使用import语句引入better-scroll插件，如下：

npm i smooth-scrollbar

import Scrollbar from 'smooth-scrollbar';

Scrollbar.init(document.querySelector('#my-scrollbar'));
		

如果没有使用任何bundlers，可以加载UMD捆绑包，通过script标签引用dist/smooth-scrollbar.js文件。

var Scrollbar = window.Scrollbar;

Scrollbar.init(document.querySelector('#my-scrollbar'));
		

配置参数

Smooth-Scrollbar提供了丰富的配置选项以便让用户定制化自己的滚动条。以下是一些常用的配置参数及其说明：

• damping: 阻尼系数，值越大滚动条的弹性越小，滚动越不灵敏。
• thumbMinSize: 滑块的最小尺寸，当滚动条的高度或宽度小于此值时，滑块将不再显示。
• renderByPixels: 是否根据像素渲染滑块，如果为 false，则会根据滚动条的尺寸按比例渲染。
• alwaysShowTracks: 是否始终显示滚动条，而不是只在需要滚动时才显示。
• continuousScrolling: 是否启用连续滚动，即在滑块释放后继续滚动一段距离。
• wheelEventTarget: 指定接收鼠标滚轮事件的元素，默认为滚动条本身。
• plugins: 插件选项，可以加载一些额外的插件来增强滚动条的功能，例如缓动动画和滚动到指定位置。

浏览器兼容

github网址：https://github.com/idiotWu/smooth-scrollbar