javascript - 使用 jquery 在特定 DIV 中滚动事件

标签 javascript jquery scroll

我正在寻找的是当通过键盘滚动在特定 div 上发生时触发的事件。我已经浏览并尝试实现几个代码片段和插件来实现这一目标,但这对我没有帮助。当我使用鼠标滚轮事件和scrollTop函数通过鼠标在特定div内滚动时,我已经实现了相同的功能。

我想要的是当用户在特定 div 中滚动时,用户应该导航到另一个 div/部分。

第一个带有图像的屏幕位于我在鼠标滚轮上实现了scrollTop 的div 中。我想通过键盘使用滚动事件实现相同的功能

您可以看到现场直播http://www.eccentricengine.com/Demo/eccentric/并查看我尝试实现的示例的来源。JS 中也存在冲突的可能性。

最佳答案

查看一个小演示,它可能会对您有所帮助。单击 div 内部,然后按键盘上的向下或向上键。

$("span").hide();
$(".box").scroll(function() {
    $("span").css( "display", "inline" ).fadeOut( "slow" );
});
div.box{
  width: 200px;
  height: 150px;
  overflow: scroll;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box">
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here <br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here<br>
     text here
</div>
<span>Scrolling</span>

关于javascript - 使用 jquery 在特定 DIV 中滚动事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28299661/

相关文章:

javascript - Meteor 将输入存储在集合中

javascript - 通过 javascript 添加 cookie 导致我的 laravel 错误

始终返回函数值的Javascript变量

javascript - jquery通过php echo实现多个id选择器

android: ViewPager 和 Horizo​​ntalScrollVIew

javascript - 带 Twitter bootstrap 的水平滚动表

javascript - 如何在 Three.js 上创建带有 slider 的变形动画?

javascript - 如何在 bxslider 控件中添加非事件类?

javascript - DataTables自定义检测插件及排序顺序

javascript - ScrollIntoView 元素上方 20px?