scrollTop判断向上滑动还是向下滑动
2020-12-07 本文已影响0人
squidbrother
概述
在不使用触摸事件的情况下,如何判断移动端、PC端,页面滚动的方向
1.主要通过scrollTop的前后比对,借助JQuery的库方便些
2.因为涉及到监测scroll事件,所以还需要做下防抖的工作
3.在IOS端,由于页面本身存在弹性滚动的浏览器默认渲染问题,所以需要修正下BUG
即在一个极限高度上,进行判断(_yArr.length>=2)
(function(){
var iTimer = null;
var _yArr = [];
var _win = $(window);
_win.on('scroll',function(e){
_yArr.push(_win.scrollTop());
clearTimeout(iTimer);
setTimeout(function(){
if(_yArr.length>=2){
var _lth = _yArr.length;
if(_yArr[_lth-1]>_yArr[0]){
// document.title = '向下';
//IOS 弹性滚动默认行为导致的问题
if(_win.scrollTop()<_win.height()/2){ return false; }
//做你想做的操作...
}else{
// document.title = '向上';
//做你想做的操作...
}
_yArr = [];
};
},100);
});
})();