
本文介绍一种无需修改 Divi 核心文件的安全方式,通过重写 et_pb_smooth_scroll 全局函数,将锚点跳转强制设为瞬时定位(0ms 动画),彻底禁用默认的平滑滚动效果。
本文介绍一种无需修改 divi 核心文件的安全方式,通过重写 `et_pb_smooth_scroll` 全局函数,将锚点跳转强制设为瞬时定位(0ms 动画),彻底禁用默认的平滑滚动效果。
Divi 主题默认为所有内部锚点链接(如导航菜单中的 #section-id)启用了平滑滚动(smooth scroll)功能,其底层依赖于全局函数 et_pb_smooth_scroll。该函数被广泛调用于页面内跳转、返回顶部、滚动到模块等交互场景。直接修改 Divi/js/scripts.js 或 custom.js 中的硬编码值(如将 800 改为 0)虽能生效,但存在严重风险:主题更新后代码将被覆盖,且违反 WordPress 最佳实践。
✅ 推荐方案是安全覆写(safe override):在子主题的 footer.php、functions.php(通过 wp_add_inline_script)或自定义 JavaScript 文件中,于 DOM 加载完成后,临时保存原始函数引用,并重新定义 window.et_pb_smooth_scroll,强制将 speed 参数设为 0、easing 设为 'linear'——这相当于关闭动画,实现原生 scrollIntoView({ behavior: 'auto' }) 的即时跳转效果。
以下是推荐部署的完整代码(兼容 Divi 4.0+ 及最新版本):
<script>
jQuery(document).ready(function($) {
// 保存原始函数引用,确保不丢失其他逻辑(如 offset 计算、hash 更新等)
const originalSmoothScroll = window.et_pb_smooth_scroll;
// 重定义 et_pb_smooth_scroll:强制 speed=0,禁用动画
window.et_pb_smooth_scroll = function($target, $top_section, speed, easing) {
// 保留原始函数的所有参数处理逻辑,仅覆盖动画时长与缓动
// 注意:$target 可能是 jQuery 对象或选择器字符串,originalSmoothScroll 内部已做兼容处理
originalSmoothScroll($target, $top_section, 0, 'linear');
};
});
</script>? 关键说明与注意事项:
- ✅ 零侵入性:不修改任何 Divi 主题文件,升级无忧;
- ✅ 全场景生效:不仅作用于顶部导航,也覆盖模块设置中的“跳转到节”按钮、侧边栏锚点、返回顶部等所有调用 et_pb_smooth_scroll 的位置;
- ⚠️ 执行时机必须为 document.ready 之后,确保 window.et_pb_smooth_scroll 已由 Divi 加载完毕;
- ⚠️ 若使用子主题,建议将上述代码通过 wp_add_inline_script() 注入 divi-js 或 et-core-common-js 依赖队列,避免竞态问题;
- ❌ 不要移除或 undefined 原始函数——Divi 内部其他逻辑(如视差计算、滚动监听初始化)可能依赖其存在。
? 进阶提示(可选):若需进一步优化用户体验(例如避免跳转后 URL hash 变化触发浏览器历史记录),可在重写函数中补充 history.replaceState() 控制,但对绝大多数站点而言,上述方案已完全满足“瞬时跳转、无回弹、无二次滚动”的核心需求。
总之,通过函数级覆写而非 DOM 事件劫持(如 preventDefault + scrollTop),我们既规避了手动操作 html/body 滚动带来的兼容性陷阱(如 Safari 表现异常、固定头部偏移错位),又保持了 Divi 原有锚点逻辑的完整性与健壮性。

















