js scroll 上下滚动

// 获取页面的滚动位置
function getScrollPosition() {
  return window.pageYOffset || document.documentElement.scrollTop;
}

// 当用户滚动时触发的函数
function handleScroll() {
  const scrollPosition = getScrollPosition();
  const button = document.getElementById('back-to-top-button');

  if (scrollPosition > 300) { // 如果滚动超过300px，则显示按钮
    button.style.display = 'block';
  } else {
    button.style.display = 'none'; // 否则隐藏按钮
  }
}

// 为window对象添加scroll事件监听器
window.addEventListener('scroll', handleScroll);

// 返回顶部按钮的点击事件
document.getElementById('back-to-top-button').addEventListener('click', () => {
  window.scrollTo({ top: 0, behavior: 'smooth' }); // 平滑滚动到顶部
});

<button id="back-to-top-button" style="display: none;">返回顶部</button>