js单纯判断滚动条方向

转载 2017年04月25日 17:58:11
Js代码  
function scroll( fn ) {  
    var beforeScrollTop = document.body.scrollTop,  
        fn = fn || function() {};  
    window.addEventListener("scroll", function() {  
        var afterScrollTop = document.body.scrollTop,  
            delta = afterScrollTop - beforeScrollTop;  
        if( delta === 0 ) return false;  
        fn( delta > 0 ? "down" : "up" );  
        beforeScrollTop = afterScrollTop;  
    }, false);  
}  
 
 
调用方法:
Js代码  
  1. scroll(function(direction) { console.log(direction) });  

相关文章推荐

jquery(js)判断页面滚动条(scroll)是向上滚还是向下滚方向判断

webtouch(webapp)页面,防苹果手机safari浏览器,网上滑动,底部导航消失,滑动到底部又出现。向下滑动,底部导航出现。遇到问题1、我一... webtouch(webapp)...
  • yuwq123
  • yuwq123
  • 2016年10月21日 10:48
  • 6321

js判断鼠标滚动放下,向上滚还是向下滚?

js判断鼠标滚动放下,向上滚还是向下滚? demo: var scrollFunc = function (e) { e = e || window.even...
  • kongjiea
  • kongjiea
  • 2014年01月20日 16:23
  • 16998

js判断鼠标滑轮滚动方向并根据滚动的方向触发不同的事件

var scrollFunc = function (e) { var direct = 0; e = e || window.event; if (e...

JS 获取滚动条位置

执行代码,滚动鼠标滚轮:

js 判断滚动条是否到达底部

1. 原生Javascript实现判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop、clientHeight、scrollHeight。 scrollTop : 滚动条在Y轴上的滚...

JS实现判断滚动条滚到页面底部并执行事件的方法

需要了解三个dom元素,分别是:clientHeight、offsetHeight、scrollTop。 clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动...

JS实现判断滚动条滚到页面底部并执行事件的方法

这篇文章主要介绍了JS实现判断滚动条滚到页面底部并执行事件的方法,本文先是分析了需求以及必备知识,然后给出实现代码,需要的朋友可以参考下需要了解三个dom元素,分别是:clientHeight、off...

Bootstrap Modal 垂直方向加滚动条

背景使用Bootstrap Modal实现用户资料修改,由于用户信息过多,默认Modal出现页面滚动条,为了用户体验,不使用页面滚动条,在Modal body部分加垂直滚动条,Modal header...
  • cyh1111
  • cyh1111
  • 2016年10月28日 23:18
  • 8951

各浏览器对于获取文档水平及垂直方向滚动条位置(scrollLeft、scrollTop)时的参考元素存在差异

 问题描述 针对获取页面的垂直滚动条的位置,IE Firefox Opera 标准模式下使用 document.documentElement.scrollLeft 获取页面的水平滚动条位置,...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:js单纯判断滚动条方向
举报原因:
原因补充:

(最多只允许输入30个字)