javascript - 通过向上和向下箭头键导航到特定的锚标记

Question

我目前正在使用锚标签，并在 5 个链接上实现了平滑滚动。这目前完美无缺。但是，我现在想添加使用箭头键在这些相同的锚标记中导航的功能。

我只能通过javascript和jquery摸索，所以当涉及到这些东西时我很困惑。

<ul>
    <li class="scrolldot"><span><a href="#one">1</a></span></li>
    <li class="scrolldot"><span><a href="#two">2</a></span></li>
    <li class="scrolldot"><span><a href="#three">3</a></span></li>
    <li class="scrolldot"><span><a href="#four">4</a></span></li>
    <li class="scrolldot"><span><a href="#five">5</a></span></li>
    <li class="scrolldot"><span><a href="#six">6</a></span></li>
</ul>

所以基本上，我希望用户点击向下箭头并将他们带到下一部分，具体取决于他们在页面上的位置。如果他们在第 2 部分，请将它们带到第 3 部分。如果他们再次击中，他们将被带回两个等等。说得通？

Answer 1

结帐捕鼠器。这是一个漂亮的小库，可以很容易地绑定键。网站上也有一些很好的例子。

也许这样的事情就足够了：

Mousetrap.bind('up', function() {
    your_up_function();
});

Mousetrap.bind('down', function() {
    your_down_function();
});