将箭头键映射到滚轮功能?

Question

我正在客户站点上运行幻灯片。 幻灯片对每张幻灯片进行动画处理，并且仅依赖于鼠标的滚轮，尽管它在触摸屏设备中也会"滑动"。

这里需要注意的是，使用滚轮时，页面实际上并没有扫射，它只会激活下一个幻灯片动画。 该网页从未真正在传统意义上进行过

...但是，有些人不使用滚轮，而是使用键盘箭头。

有没有办法，理想情况下使用 JavaScript，强制箭头键模拟鼠标滚轮的单个滚动？

对于缺少代码或以前的努力，我深表歉意 - 我无法找到有关此问题的任何内容，并且代码很好地嵌入在幻灯片扩展中。 我希望添加我自己的JS来补充基础幻灯片。

Answer 1

您可以尝试使用如下代码通过代码触发库元素上的鼠标滚轮事件：

var element = <reference to the element the mousewheel events are bound to>
document.addEventListener('keydown', function(e){
var event = new Event('MouseEvents');
event.initEvent('mousewheel', true, true);
switch(e.keyCode){
case '37':
event.wheelDelta = -1;
element.dispatchEvent(event);
break;
case '39':
event.wheelDelta = 1;
element.dispatchEvent(event);
break;
}
});

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

Answer 2

你可以尝试这样的事情。这不是一个实际的解决方案，而是一种方法。

$('#someContainer').scroll(function(){
$( "#target" ).keydown();
})

Answer 3

你可以做这样的事情：

yourElement.addEventListener('onkeydown', function(e) {
var key = e.which || e.keyCode;
if (key === 37) { // arrow left
// Your code here
} else if (key === 39) { // arrow right
// Your code here
}
});