1

我试图了解使用键导航网站的概念。

作为练习，我只使用箭头键浏览一个简单的页面。到目前为止，我能够获取向上和向下键的 keyCodes 并使用以下代码捕获事件 -

document.onkeyup = KeyCheck;

function KeyCheck(e) {
    var KeyID = (window.event) ? event.keyCode : e.keyCode;

    switch (KeyID) {
        case 38:
            alert("UP");
            break;
        case 40:
            alert("DOWN");
            break;
    }
}

这是小提琴：DEMO

现在我想使用箭头键浏览左侧的导航面板以显示/隐藏 rightPanel 上的相应 div。

任何指导我怎样才能让这个球滚动？

4

1 回答 1

0

我还没有尝试过，但首先想到的是这个。您可以将 rightPanel 上的所有 div 堆叠在一起，并且除了其中一个之外，所有 div 都有一个特定的类（即隐藏）。当用户按下“向上”和“向下”按钮时。您可以分别添加/删除隐藏类。

伪代码：

function navigate() {
    switch(key) {
    case up:
        add hidden to current div
        if(not the top) {
            remove hidden from the div above
        } else {
            remove hidden from the last div
        }
        break;
    case down:
        add hidden to current div
        if(not the bottom) {
            remove hidden from the div below
        } else {
            remove hidden from the first div
        }
    }
}

编辑：

您可以做的另一件事是将rightPanel 变成上下移动而不是左右移动的滑块。当用户按下时面板向上移动，当用户按下时面板向下移动。

于 2013-11-01T19:21:42.523 回答