Question

JS 判断鼠标滚轮滑动距离

我想做一个模拟浏览器滚动条
那么就需要获取到鼠标滚轮滚动方向以及鼠标滚轮滚动的距离
JS或者JQ有办法判断出方向并且获得这个滚动的距离值吗？

Answer 1

如果使用jquery的话，可以这样写：

$(window).bind("scroll", function(){ 
        var top = $(this).scrollTop(); // 当前窗口的滚动距离
  });

 如果使用原生js，可以这样写（摘自网上的）：

/** 
 * 获取<a href="https://www.baidu.com/s?wd=%E6%BB%9A%E5%8A%A8%E6%9D%A1&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1YzPARYuhu9m1n3mhDknWmd0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHT1nWmLnW6snH03nHnkPHbYPs" target="_blank" class="baidu-highlight">滚动条</a>距离顶端的距离 
 * @return {}支持IE6 
 */  
function getScrollTop() {  
        var scrollPos;  
        if (window.pageYOffset) {  
        scrollPos = window.pageYOffset; }  
        else if (document.compatMode && document.compatMode != 'BackCompat')  
        { scrollPos = document.documentElement.scrollTop; }  
        else if (document.body) { scrollPos = document.body.scrollTop; }   
        return scrollPos;   
}

追问

大神你没听明白我的意思，我的意思是制作一个模仿滚动条的
当进入这个框体 我会禁止掉scroll事件
我想的是 利用滚动鼠标 获取到滚动值 然后我就可以利用鼠标滚动的值来制作一个滚动条
就是说纯用DIV之类的写一个在右边相当于滚动条的东西 鼠标点击移动之类的好弄
但是我想像浏览器的滚动条一样 滚动鼠标滚轮 也能滚动这个滚动条
但是我只知道怎么获取鼠标滚轮向上还是向下，而我需要这个值来确定滚动多少

Answer 2

监控onscroll事件，然后获取元素的scrollTop值

追问

大神你没听明白我的意思，我的意思是制作一个模仿滚动条的
就是说 当进入这个框体 我会禁止掉scroll事件
我想的是 利用滚动鼠标 获取到滚动值 然后我就可以利用鼠标滚动的值来制作一个滚动条
就是说纯用DIV之类的写一个在右边相当于滚动条的东西 鼠标点击移动之类的好弄

但是我想像浏览器的滚动条一样 滚动鼠标滚轮 也能滚动这个滚动条