如何通过滚动切换案例

Question

如何通过滚动来切换大小写，并使其无论何时向上滚动它都会改变一个方向的情况，当你向下滚动它会改变另一个方向的情况？我希望这是有道理的。

这是我使用热键做我想做的事情，但这次我不想使用热键，我想使用滚动功能（我不是指点击滚动）

    document.addEventListener('keydown', function (e) {
    if (ws) {
        switch (e.keyCode) {
            // T
            case 84:
                if (player.items[ITEM_TYPE.WINDMAIL]) ws.send("42[\"5\"," + player.items[ITEM_TYPE.WINDMAIL].id + ",null]");
                break;

            // G
            case 71:
                e.stopPropagation();
                if (player.items[ITEM_TYPE.SPIKES]) ws.send("42[\"5\"," + player.items[ITEM_TYPE.SPIKES].id + ",null]");
                break;

            // Z
            case 90:
                e.stopPropagation();
                if (player.items[ITEM_TYPE.EXTRAS]) ws.send("42[\"5\"," + player.items[ITEM_TYPE.TURRET].id + ",null]");
                break;

            // F
            case 70:
                e.stopPropagation();
                if (player.items[ITEM_TYPE.PITTRAP]) ws.send("42[\"5\"," + player.items[ITEM_TYPE.PITTRAP].id + ",null]");
                break;

        }
    }
}, true);

这工作正常，但我想这样做，以便可以做同样的事情，但我的滚动相反！

你能帮我吗？

Answer 1

您可以使用addEventListener监听滚动事件（此处记录：https://developer.mozilla.org/en-US/docs/Web/Events/scroll）

例如

window.addEventListener('scroll', function(e) {
  // do something
});

或者在你的ui中的小盒子上捕获滚动事件

document.querySelector('.my-scrollable-box').addEventListener('scroll', function(e) {
  // do something
});

完成后，您可以跟踪最后知道的滚动位置，以确定它们是向上还是向下滚动

var last_known_scroll_position = 0;
window.addEventListener('scroll', function(e) {
  if (window.scrollY > last_known_scroll_position) {
    // the user scrolled down
  } else {
    // the user scrolled up
  }
  last_known_scroll_position = window.scrollY;
}