如何在jQuery或Javascript中将箭头绑定到“向上滚动”和向下箭头以“向下滚动”？

问题描述：

我如何可以将绑定在向上箭头（或任何其它键）来完成同样的工作作为编程瓦特/ jQuery的或Javascript滚动起来？如何在jQuery或Javascript中将箭头绑定到“向上滚动”和向下箭头以“向下滚动”？

我使用这个代码来检测向上&向下箭头点击：

$(document).keydown(function(e) { 
    switch(e.which) { 
     case 38: // up 
     console.log("up"); 

     break; 

     case 40: // down 
     console.log("down"); 
     break; 

     default: return; // exit this handler for other keys 
    } 
    e.preventDefault(); // prevent the default action (scroll/move caret) 
});

所以，当我点击在这种情况下的向下箭头，它应该叫“鼠标向下滚动”。

的理由：我可以通过与轻扫在弹出模式的内容在我的网站上下滚动在移动设备上，并用鼠标的滚动功能。如果你有一台笔记本电脑和没有鼠标呢？向上/向下箭头不工作...

这是相当复杂的。滚动就像是调整不是一个，而是几千逐像素事件...... –

你的代码工作正常的向上和向下箭头（我检查，它在控制台登录正确）。那么，什么是你的问题的 –

可能的复制[如何滚动到一个div中的元素？]（https://stackoverflow.com/questions/635706/how-to-scroll-to-an-element-inside-a-div ） –

答

我相信箭头键应该已经滚动工作（它为我的作品堆栈溢出反正！），但如果没有，我相信“scrollTo”方法可以为你工作：

var startingY = 0; 
 

 
$(document).keydown(function(e) { 
 
    switch(e.which) { 
 
     case 38: 
 
     startingY -= 20; 
 
     window.scrollTo(0, startingY); 
 
     
 
     break; 
 

 
     case 40: 
 
     startingY += 20; 
 
     window.scrollTo(0, startingY); 
 
     
 
     break; 
 

 
     default: return; 
 
    } 
 
    e.preventDefault(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div style="height:5000px"></div>

如何在jQuery或Javascript中将箭头绑定到“向上滚动”和向下箭头以“向下滚动”？

相关推荐