You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

window.pageYOffset已废弃,其替代方案是什么?

window.pageYOffset 的替代方案

window.pageYOffset 虽未完全废弃,但当前更推荐使用标准替代属性 window.scrollY,二者功能完全一致,均用于返回文档垂直方向已滚动的像素值,且主流现代浏览器都原生支持。

如果需要兼容极老旧浏览器(如IE9及更早版本),可以使用兼容性兜底写法:document.documentElement.scrollTop || document.body.scrollTop,不过日常开发中用scrollY已足够覆盖绝大多数场景。

修改后的代码示例

var prevScrollpos = window.scrollY;
window.onscroll = function() {
  var currentScrollPos = window.scrollY;
  if (prevScrollpos > currentScrollPos) {
    document.getElementById("navbar").style.top = "0";
  } else {
    document.getElementById("navbar").style.top = "-50px";
  }
  prevScrollpos = currentScrollPos;
}

极致兼容版本(针对老旧浏览器)

function getScrollY() {
  return window.scrollY || document.documentElement.scrollTop || document.body.scrollTop || 0;
}

var prevScrollpos = getScrollY();
window.onscroll = function() {
  var currentScrollPos = getScrollY();
  if (prevScrollpos > currentScrollPos) {
    document.getElementById("navbar").style.top = "0";
  } else {
    document.getElementById("navbar").style.top = "-50px";
  }
  prevScrollpos = currentScrollPos;
}

内容的提问来源于stack exchange,提问作者Cronos254

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.07 14:04:51