通过引入 luxy.js 库并正确初始化，可为整站内容启用原生、无交互依赖的全局平滑滚动体验，适用于现代浏览器，无需修改锚点链接或监听点击事件。

luxy.js 是一款轻量级、高性能的视差与平滑滚动 JavaScript 库，其核心优势在于自动接管页面默认滚动行为，无需绑定任何点击事件或修改 等传统导航逻辑——这正是你所要求的“始终生效、不依赖点击”的全局平滑滚动效果。

✅ 快速集成步骤（推荐现代项目）

1. 安装依赖（如使用构建工具）

   

   CDP浏览器大师

   CDP浏览器大师：通过Chrome DevTools Protocol驱动已登录浏览器实现自动化任务，解决反爬封号、选择器失效、SPA路由难导航、固定sleep不准四大痛点。核心能力包括UA伪装、WebGL/Canvas指纹混淆、智能等待、动态选择器以及可视化调试。

   下载

   npm install luxy.js --save

   然后在主 JS 入口文件中导入并初始化：

   import luxy from 'luxy.js';
   luxy.init({
     wrapper: '#luxy', // 滚动作用域容器（见下文说明）
     wrapperSpeed: 0.05, // 滚动阻尼系数，值越小越顺滑（建议 0.03–0.07）
     touchSpeed: 0.05,
   });

2. HTML 结构：包裹全部可滚动内容
   将全站主要内容（如

   、

   、

   ）统一包裹在一个具有 id="luxy" 的容器内：

   <body>
     <div id="luxy">
       <header>...</header>
       <main>...</main>
       <footer>...</footer>
     </div>
     <!-- luxy.js 脚本置于 body 底部 -->
     <script src="node_modules/luxy.js/dist/luxy.min.js"></script>
     <script>luxy.init();</script>
   </body>

⚠️ 注意事项： #luxy 容器必须是 的直接子元素，且需设置 height: 100vh; overflow: hidden;（luxy 会自动创建内部滚动层）； 原生 scroll-behavior: smooth 仅支持锚点跳转，无法实现连续滚动平滑化，而 luxy.js 通过 requestAnimationFrame + transform 实现帧率稳定的物理滚动模拟； 若页面含 iframe、Canvas 或第三方组件，建议为其添加 data-luxy-ignore 属性以避免渲染异常； 移动端需启用 touchSpeed 参数，并确保 viewport meta 标签完整：。

? 替代方案对比（简要）

方案	是否全局生效	是否需点击触发	浏览器兼容性	备注
scroll-behavior: smooth (CSS)	❌ 仅锚点跳转	✅ 是	Chrome 61+, Firefox 68+	原生、零 JS，但不满足“始终平滑”需求
window.scrollTo({ behavior: 'smooth' }) (JS)	❌ 需手动调用	✅ 是	广泛支持	适合局部控制，非自动接管
luxy.js	✅ 全局接管原生滚动	❌ 否	Chrome/Firefox/Safari/Edge（≥v91）	推荐用于追求设计感与一致动效的现代站点

完成配置后，用户无论使用鼠标滚轮、触控板、键盘方向键或触摸屏拖拽，都将获得如 Webflow Luxy 示例 般丝滑、有弹性的滚动体验——真正实现「开箱即用」的全局平滑滚动。