Javascript 如何触发滚动上bxSlider的向下和向上箭头单击？

我有一个垂直的bxslider。单击箭头，滑块将上下滚动。我还想在scroll上触发相同的箭头单击功能

这里是同样的JSFIDLE。在这种情况下，它仅在单击箭头时滑动。我需要在滚动相同的功能。谁能帮忙吗

$(document).ready(function() {
            $('#bxslider-vertical .bxslider').bxSlider({
                mode: 'vertical', 
                infiniteLoop: false,
                pager:false,
                slideWidth: 200,
                minSlides: 2,                
                slideMargin: 10                                 
            });
});

JSFIDLE

---

您可以将

鼠标滚轮DOMMouseScroll

绑定到滑块：

$（文档）.ready（函数（）{
变量滑块=$（'#bxslider vertical.bxslider'）。bxslider({
模式：“垂直”，
无穷远：错，
传呼机：错，
滑动宽度：200，
米斯利德斯：2，
幻灯片摘要：10
});
$（'#bxslider vertical.bxslider'）.bind（'mousewheel-DOMMouseScroll'，函数（事件）{
if（event.originalEvent.wheelDelta>0 | | event.originalEvent.detail<0）{
slider.goToPrevSlide（）；
}否则{
slider.goToNextSlide（）；
}
});
});
h3{
文本对齐：居中；
}
人力资源{
边界：无；
高度：1px；
/*设置hr颜色*/
颜色：#333；
/*老家伙*/
背景色：#333；
/*现代浏览器*/
}
#bxslider vertical.bx wrapper.bx控制方向a{
位置：绝对位置；
利润上限：-16px；
大纲：0；
宽度：32px；
高度：32px；
文本缩进：-9999px；
z指数：9999；
顶部：自动；
}
#bxslider vertical.bx wrapper.bx prev{
排名：6%！重要；
左：85px！重要；
背景：url(https://cdn4.iconfinder.com/data/icons/miu/22/circle_arrow-up-24.png)不重复；
}
#bxslider vertical.bx wrapper.bx next{
底部：1%！重要；
左：85像素；
背景：url(https://cdn4.iconfinder.com/data/icons/miu/22/circle_arrow-down_download-24.png)不重复；
}
#bxslider vertical.bx wrapper.bx next:悬停{
背景：url(https://cdn4.iconfinder.com/data/icons/miu/22/circle_arrow-down_download-24.png)不重复；
}
#bxslider vertical.bx wrapper.bx视口，
#bxslider horizontal.bx wrapper.bx视口{
-莫兹盒阴影：无；
-webkit盒阴影：无；
盒影：无；
边框：1px纯色灰色；
边界半径：5px；
左：0px！重要；
填充物：5px；
背景：透明；
-webkit转换：translatez（0）；
-moz变换：translatez（0）；
-ms变换：translatez（0）；
-o变换：translatez（0）；
变换：translatez（0）；
}

垂直模式
谢谢您的帮助。但只有当“活动”类到达幻灯片的最后一部分时，我才需要滚动bx滑块。类似于时间线。当我们滚动身体时，它也应该滚动。在这里，它仅在指针位于bxslider上时才会滚动。因此，将$（'#bxslider vertical.bxslider'）更改为$（'body'）是的，但它不起作用。我有一个与此（）相关的最新提琴和问题。请帮我整合卷轴。谢谢大家!@奥斯曼雷夫古内斯