17370845950

通过 javascript 在页面卸载前强制滚动到顶部，可确保刷新后用户始终从页面最上方开始浏览，避免因 `overflow: hidden` 导致的视觉卡顿或位置异常。

在使用 body { overflow-y: hidden } 控制布局（例如实现全屏切换、视差滚动或模态内容展示）时，一个常见问题是：当用户已手动向下滚动并触发刷新（F5 或地址栏回车），浏览器会默认恢复至刷新前的滚动位置——而此时 overflow-y: hidden 已生效，导致内容被截断、页面“卡在中间”，用户体验严重受损。

虽然 window.scrollTo(0, 0) 可在 load、DOMContentLoaded 或 pageshow 中调用，但这些时机均发生在页面重绘之后，用户仍可能短暂看到滚动过程（尤其在较慢设备上），违背“无感回归顶部”的需求。

✅ 正确解法是利用 beforeunload 事件：它在页面即将卸载（包括刷新、导航离开）前触发，此时 DOM 仍完整可用，且滚动操作不会被用户察觉——因为紧接着页面就进入卸载流程，视觉上无任何过渡动画。

window.addEventListener('beforeunload', () => {
  window.scrollTo(0, 0);
});

⚠️ 注意事项：

• 该方案兼容所有现代浏览器（Chrome、Firefox、Safari、Edge），无需 polyfill；
• 不要使用 onbeforeunload = function() {...} 赋值方式（易被覆盖），推荐 addEventListener 以保证可靠性；
• 若页面存在多个 beforeunload 监听器，此滚动逻辑应置于最前端或确保优先执行；
• 此方法仅影响刷新/离开行为，不影响用户正常滚动交互；页面首次加载时，浏览器默认已在顶部，无需额外处理。

? 进阶建议：若需兼容 Safari 的 pageshow 缓存恢复场景（如前进/后退），可补充监听：

window.addEventListener('pageshow', (e) => {
  if (e.persisted) {
    window.scrollTo(0, 0);
  }
});

综上，beforeunload + scrollTo(0, 0) 是轻量、可靠、无闪动的纯原生解决方案，完美契合绝对定位布局与隐藏溢出的交互设计需求。