# vuepress-plugin-smooth-scroll
在你的 VuePress 站点中使用平滑滚动。
这个插件简单做了两件事:
- 在 scrollBehavior 中使用
window.scrollTo({ behavior: 'smooth' })
- 将样式
scroll-behavior: smooth;
加入<html>
元素
提示
- 第一个仅对
<RouterLink to="#anchor">
生效 - 第二个则对
<RouterLink to="#anchor">
和<a href="#anchor">
都生效
这两种特性的浏览器兼容性并不一样,所以目前我们同时使用了这两种特性。
为了更好的浏览器兼容性,我们建议你尽量在你的 markdown 文件中使用 <RouterLink to="#anchor">
。
# 安装
npm install -D vuepress-plugin-smooth-scroll
# 使用
// .vuepress/config.js
module.exports = {
plugins: ['vuepress-plugin-smooth-scroll'],
}
# 演示
- 点击侧边栏中的链接
- 点击文章标题前的锚点
只
是
为
了
让
页
面
更
长