js监控html页面的上下滚动事件方法

最近在一个项目中，写前端页面的时候，想象一下以前做Android的时候，听页面上下滚动的事件。查找数据，发现鼠标或类似用户动作触发的事件有如下图：

话不多说，直接上代码，测试后就可以用了：

！doctype html html head metharset=' utf-8 '/title dome/title script type=' text/JavaScript '函数scroll(){//console . log(' print log log log ')；查看效果控制台。日志('开始滚动！');} var scrollFunc=function(e){ e=e | | window . event；If (e.wheelDelta) {//第一步：先判断浏览器IE，Google滑轮事件if(e . wheel delta 0){//console . log滑轮上卷('滑轮上卷')；}如果(e.wheelDelta 0) {//console.log当滑轮向下滚动时('滑轮向下滚动')；}} else if (e.detail) {//Firefox滑轮事件if (e.detail 0) {//console.log滑轮卷起时('滑轮卷起')；}如果(e.detail 0) {//console.log当滑轮向下滚动时('滑轮向下滚动')；} } }//滚动事件if(文档。addevent listener){//Firefox document。addeventlistener(' dommessroll '，scrollfunc，false)；}//滚动滑轮触发scrollFunc方法//ie Google window . onmousewheel=document . onmousewheel=scroll func；/script/head body on croll=' scroll()' div style=' height : 2000 px；背景-color : aqua；'/div/body/html如果你曾经使用过console.log(" ")，我来看看下面这张图(谷歌浏览器):

以上监控html页面上下滚动事件的js方法是边肖分享的全部内容，希望能给大家一个参考和支持。