Question

我正在尝试使用jQuery动画创建滚动效果，但仅限于键盘用户。我不希望页面滚动鼠标用户。以下是当前代码。我仍然遇到让点击功能实际上不滚动的问题。

//scroll page with keyboard focus   
$(':focusable').on('focus', function() {
    var ele = $(this);
    $('html, body').stop().animate({
        scrollTop: ele.offset().top - 100
    }, 500);
});
//do not scroll page with clicking of mouse
$(':focusable').on('click', function() {
    var ele = $(this);
    $('html, body').stop().animate({
        scrollTop:  ele.offset().top - 0
    }, 5000);
});

我最接近的是将动画时间更改为5秒，而不是像对焦功能那样为滚动距离添加任何高度。任何帮助将不胜感激。

Answer 1

我看着你的方法，A。沃尔夫。我一起删除了所有点击，并提出了这个解决方案。

//scroll page with keyboard focus   
$(':focusable').on('keyup', function(e) {
     var keyCode = e.keyCode || e.which; 
    if (keyCode == 9) {
        $('html, body').stop().animate({
           scrollTop: $(this).offset().top - 100
        }, 500);
    }
});

感谢您的帮助。

jQuery animate scrolltop - 防止点击

1 个答案: