如何滚动菜单，而不在后台滚动页面内容？

<div id="menu">菜单内容</div>

#menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #f1f1f1;
  /* 其他样式属性 */
}

window.addEventListener('scroll', function() {
  var menu = document.getElementById('menu');
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
  
  if (scrollTop > 100) {
    menu.style.display = 'block'; // 显示菜单
  } else {
    menu.style.display = 'none'; // 隐藏菜单
  }
});