通过向上和向下箭头按下导航到特定的锚标签

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。它是一个漂亮的小库，使绑定键很容易。网站上也有一些很好的例子。

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

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

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