如何通过滚动切换案例

时间:2017-12-21 00:21:51

标签: javascript jquery html css

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

以下是我使用热键执行操作的方法,但这次我不想使用热键,我想使用滚动功能(我不是指点击滚动)

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

并且工作正常,但我想做到这样可以做同样的事情,但我的滚动相反!

你能帮忙吗?

1 个答案:

答案 0 :(得分: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;
}