向jQuery scrollTop添加箭头键导航

我使用jQuery scrollTop浏览页面上的点。效果很好。但我想知道是否有可能添加上/下箭头键导航到它。例如，向下箭头滚动到下一个点，下一个点，等等。向上箭头返回一个点，等等。非常感谢您对这一点的任何帮助

HTML:

---

这不完全是对你问题的回答，但如果你想尝试使用它，它内置了这个功能

---

在初始化过程中，您只需输入{showArrows:true；}并完成。

不完全是问题的答案，但如果您想尝试使用它，它内置了此功能

---

在初始化过程中，您只需输入{showrows:true；}并完成。

类似的内容应该是您正在寻找的

可以很容易地添加一些东西，以确定你在移动前页面的哪个部分，以防用户用鼠标滚动

var navPoints = [
            '#option1',
            '#option2',
            '#option3',
            '#option4',
            '#option5'
        ];

        var currentPoint = 0;

        var moveToElement = function() {
            var elementTop = $(navPoints[currentPoint]).offset().top;
            $("html:not(:animated),body:not(:animated)").delay( 300 ).animate({ scrollTop: elementTop-20}, 700 );
        }

        $(document).keyup(function(e) {
            switch (e.which) {
                case 38:
                    // Up Arrow
                    if(currentPoint > 0)
                        currentPoint--;
                    break;
                case 40:
                    // Down Arrow
                    if(currentPoint < navPoints.length - 1)
                        currentPoint++;
                    break;
                default:
                    // Some other key
                    return;
            }

            moveToElement();
        });

var导航点=[
“#选项1”，
“#选项2”，
“#选项3”，
“#选项4”，
“#选项5”
];
var currentPoint=0；
var moveToElement=函数（）{
var elementTop=$（导航点[currentPoint]）.offset（）.top；
$（（html:not（：animated），body:not（：animated）”）.delay（300）.animate（{scrollTop:elementTop-20}，700）；
}
$（文档）.keyup（函数（e）{
开关（e.which）{
案例38：
//向上箭头
如果（当前点>0）
当前点--；
打破
案例40：
//向下箭头
如果（currentPoint

像这样的东西应该是你想要的

可以很容易地添加一些东西，以确定你在移动前页面的哪个部分，以防用户用鼠标滚动

var navPoints = [
            '#option1',
            '#option2',
            '#option3',
            '#option4',
            '#option5'
        ];

        var currentPoint = 0;

        var moveToElement = function() {
            var elementTop = $(navPoints[currentPoint]).offset().top;
            $("html:not(:animated),body:not(:animated)").delay( 300 ).animate({ scrollTop: elementTop-20}, 700 );
        }

        $(document).keyup(function(e) {
            switch (e.which) {
                case 38:
                    // Up Arrow
                    if(currentPoint > 0)
                        currentPoint--;
                    break;
                case 40:
                    // Down Arrow
                    if(currentPoint < navPoints.length - 1)
                        currentPoint++;
                    break;
                default:
                    // Some other key
                    return;
            }

            moveToElement();
        });

var导航点=[
“#选项1”，
“#选项2”，
“#选项3”，
“#选项4”，
“#选项5”
];
var currentPoint=0；
var moveToElement=函数（）{
var elementTop=$（导航点[currentPoint]）.offset（）.top；
$（（html:not（：animated），body:not（：animated）”）.delay（300）.animate（{scrollTop:elementTop-20}，700）；
}
$（文档）.keyup（函数（e）{
开关（e.which）{
案例38：
//向上箭头
如果（当前点>0）
当前点--；
打破
案例40：
//向下箭头
如果（currentPoint

var navPoints = [
            '#option1',
            '#option2',
            '#option3',
            '#option4',
            '#option5'
        ];

        var currentPoint = 0;

        var moveToElement = function() {
            var elementTop = $(navPoints[currentPoint]).offset().top;
            $("html:not(:animated),body:not(:animated)").delay( 300 ).animate({ scrollTop: elementTop-20}, 700 );
        }

        $(document).keyup(function(e) {
            switch (e.which) {
                case 38:
                    // Up Arrow
                    if(currentPoint > 0)
                        currentPoint--;
                    break;
                case 40:
                    // Down Arrow
                    if(currentPoint < navPoints.length - 1)
                        currentPoint++;
                    break;
                default:
                    // Some other key
                    return;
            }

            moveToElement();
        });