javascript - 如何通过滚动切换大小写

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;
}