jquery确定滚动事件方向的方法:使用【scrollTop()】方法设置或返回被选元素的垂直滚动条位置,语法为【$(selector).scrollTop(position)】。
本教程操作环境:windows7系统、jquery3.2.1版,该方法适用于所有品牌电脑。
jquery确定滚动事件方向的方法:
在jQuery中可以使用scrollTop()方法来确定滚动事件的方向,scrollTop()方法用于设置或返回所选元素的垂直滚动条位置。利用这种方法,我们就可以确定滚动方向。
<strong>jQuery scrollTop()</strong>
方法
scrollTop() 方法设置或返回被选元素的垂直滚动条位置。
提示:当滚动条位于最顶部时,位置是 0。
语法:
$(selector).scrollTop(position)
参数:此方法接受单个参数position,该position参数是可选的。它用于指定垂直滚动条位置(以像素为单位)。
返回值:返回所选元素滚动条的垂直位置。
示例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> html,body { height: 300% } div { position: fixed; padding-left: 10px; padding-top: 30px; height: 10%; width: 35%; font-weight: bold; border: 2px solid red; } </style> </head> <body> <div></div> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> <script> var position = $(window).scrollTop(); $(window).scroll(function() { var scroll = $(window).scrollTop(); if(scroll > position) { console.log('scrollDown'); $('div').text('向下滚动'); } else { console.log('scrollUp'); $('div').text('向上滚动'); } position = scroll; }); </script> </body> </html>
相关免费学习推荐:JavaScript(视频)
以上是jquery怎样才能确定滚动事件的方向的详细内容。更多信息请关注PHP中文网其他相关文章!