判断滚动条的滚动方向

滚动条事件是js事件中一 个很普遍的事件,如通常网站见到的返回到顶部,还有一些网站侧边栏跟随滚动条的侧边栏,这些都是一个 前端工程师必知的常识,下面我带大家简要的说说滚动条事件的一些基础知识,并顺带给大家一个需要用到的滚动条特效–判断滚动条的滚动方向

一.获取滚动条的高度

var  oScrollTop=document.documentElement.scrollTop//w3c标准

var oScrollTop=document.body.scrollTop//非w3c标准

所以兼容处理后得 var  oScrollTop=document.documentElement.scrollTop||document.body.scrollTop;

二.事件写法

window.οnscrοll=function(){}

三.判断滚动条的滚动方向

var sign = 10;//定义默认的向上滚与向下滚的边界
window.onscroll = window.onresize = function(){
var  oScrollTop=document.documentElement.scrollTop||document.body.scrollTop;
if ( oScrollTop > sign) {
sign =  oScrollTop;//更新scrollTop
document.title=”向下”+ oScrollTop;
}
if ( oScrollTop< sign) {
sign =  oScrollTop//更新scrollTop
document.title=”向上”+ oScrollTop;
}
}

你可能感兴趣的:(web前端)