在 JavaScript 中重新启用鼠标滚动

Question

我一直在修补以下代码笔。它可以防止用户向下滚动页面，而是使用向下滚动来形成星座动画。如何允许用户在星座动画完成后向下滚动页面？就目前而言，无论动画的状态如何，滚动都是禁用的。

这是我正在努力处理的代码的摘录。

window.addEventListener("mousewheel", MouseWheelHandler, false);
window.addEventListener("DOMMouseScroll", MouseWheelHandler, false);
function MouseWheelHandler(e) {
  var e = window.event || e; // old IE support
  var delta = Math.max(-30, Math.min(60, (e.wheelDelta || -e.detail)));
  if (delta > 0) {
    showFinal=false;
    for(var i = 0; i < stars.length; i++) {
      stars[i].reseting = true;
    }
  } else {
    showFinal=true;
  }
  for(var i = 0; i < stars.length; i++) {
    stars[i].move();
  }
  e.preventDefault();
}
window.addEventListener("keydown", keyDown, false);
function keyDown(e) {
  var keyCode = e.keyCode;
  if (keyCode==38) {
    //up
    showFinal = false;
    for(var i = 0; i < stars.length; i++) {
      stars[i].reseting = true;
    }
  } 
  if (keyCode==40) {
    //down
    showFinal = true;
  }
  for(var i = 0; i < stars.length; i++) {
    stars[i].move();
  }
  e.preventDefault();
}

Answer 1

好吧，

我不建议这样做，但这是您需要做的 2 项更改

#container {
    overflow:auto;
    position:relative;
}

并从function MouseWheelHandler(e) {中删除e.preventDefault();您需要在正文中添加更多文本才能看到滚动。

Answer 2

禁用滚动：

$('#container').css('overflow', 'hidden');

启用滚动：

$('#container').css('overflow', 'scroll');